.elementor-540 .elementor-element.elementor-element-3c963b7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-1e80007{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-4e76434{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-b0594b9{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-b592d37{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-a788344{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-311d423{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-cc7d625{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-540 .elementor-element.elementor-element-3c963b7{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-1e80007{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-4e76434{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-b0594b9{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-b592d37{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-a788344{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-540 .elementor-element.elementor-element-311d423{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS *//* A N I M A Ç Õ E S D O S I T E */ /* ***************** */ /* ***************** */ /* ***************** */ .entradacomdesfoqueezoomdiminuindo{ opacity: 0; filter: blur(18px); transform: translateY(0px) translateX(0px) scale(2) rotate(0deg); transition: all 0.7s ease; } .entradacomdesfoque{ opacity: 0; filter: blur(18px); transform: translateY(0px) translateX(0px) scale(1) rotate(0deg); transition: all 1.4s ease; } .entradaesquerda{ opacity: 0; filter: blur(16px); transform: translateY(0px) translateX(-20px) scale(1); transition: all 1.4s ease; } .entradadireita{ opacity: 0; filter: blur(16px); transform: translateY(0px) translateX(20px) scale(1); transition: all 2s ease; } .entradabaixo{ opacity: 0; filter: blur(16px); transform: translateY(20px) translateX(0px) scale(1); transition: all 1s ease; } .entradacima{ opacity: 0; filter: blur(16px); transform: translateY(-20px) translateX(0px) scale(1); transition: all 1s ease; } .exibir { opacity: 1; filter: blur(0px); transform: translateY(0px) translateX(0px) scale(1) rotate(0deg); } .elementor-editor-active .entradabaixo, .elementor-editor-active .entradacomdesfoque, .elementor-editor-active .entradaesquerda, .elementor-editor-active .entradacomdesfoqueezoomdiminuindo, .elementor-editor-active .entradadireita { opacity: 1; filter: blur(0px); transform: translateY(0px) translateX(0px) scale(1) rotate(0deg); transition: all 0.7s ease; } /* F I M A N I M A Ç Õ E S D O S I T E */ /* ***************** */ /* ***************** */ /* ***************** */ /* VARIÁVEIS */ /* *************** */ /* BLOCO DE VARIÁVEIS */ :root { /* --- CONFIGURAÇÕES TÉCNICAS --- */ --h-font-family: "Poppins", sans-serif; --p-font-family: "Poppins", sans-serif; --btn-font-family: "Poppins", sans-serif; --h-weight-400: 400; --h-weight-500: 500; --h-weight-600: 600; --p-weight: 400; --btn-weight: 600; --espacamento-letras-desk: 0.6rem; --espacamento-letras-mob: 0; --espacamento-letras-mob-2: 0.05rem; --text-wrap-wrap: wrap; --text-wrap-nowrap: nowrap; /* --- CONFIGURAÇÕES DE VARIÁVEIS RESPONSIVAS --- */ /* --- BREAKPOINT: Menor de 360px --- */ --h1-v-360: 1.45rem; --h2-v-360: 1.1rem; --h3-v-360: 1rem; --h4-v-360: 1.2rem; --h5-v-360: 1.1rem; --h6-v-360: 1rem; --p-v-360: 0.95rem; --lat-360: 1rem; --ele-360: 2rem; --btn-v-360: 0.95rem; --btn-pd-360: 4px 40px; --gap-360: 3rem; /* --- BREAKPOINT: 426px (Base Mobile) --- */ /*--h1-v-426: 1.8rem; */ --h1-v-426: clamp(1.57rem, -0.4292rem + 8.861vw, 1.93rem); --h1-lh-426: 1.2; --h2-v-426: 1.3rem; /* 1.55rem */ --h2-lh-426: 1.3; --h3-v-426: 1.1rem; --h3-lh-426: 1.6; --h4-v-426: 1.2rem; --h4-lh-426: 1.4; --h5-v-426: 1.1rem; --h5-lh-426: 1.4; --h6-v-426: 1rem; --h6-lh-426: 1.4; --p-v-426: 0.88rem; --p-lh-426: 1.8; --lat-426: 1.5rem; --ele-426: 2.5rem; --btn-v-426: 1rem; --btn-pd-426: 8px 60px; --btn-lh-426: 1.6; --gap-426: 4rem; /* --- BREAKPOINT: 480px --- clamp(1.91rem, 7.5vw, 2.3rem) */ --h1-v-480: clamp(1.89rem, -0.2047rem + 7.849vw, 2.15rem); --h2-v-480: 1.3rem; --h3-v-480: 1.1rem; --h4-v-480: 1.25rem; --h5-v-480: 1.15rem; --h6-v-480: 1rem; --p-v-480: 1rem; --lat-480: 1.8rem; --ele-480: 2.5rem; --btn-v-480: 1rem; --btn-pd-480: 8px 60px; --gap-480: 4.5rem; /* --- BREAKPOINT: 767px (Tablet Portrait) --- */ --h1-v-767: 2rem; --h2-v-767: 1.23rem; --h3-v-767: 1.1rem; --h4-v-767: 1.3rem; --h5-v-767: 1.2rem; --h6-v-767: 1.1rem; --p-v-767: 1rem; --gap-767: 5rem; --lat-767: 2.5rem; --ele-767: 1.5rem; --btn-v-767: 1.05rem; --btn-pd-767: 6px 60px; /* --- BREAKPOINT: 880px --- */ --h1-v-880: 2.48rem; --h2-v-880: 1.53rem; --h3-v-880: 1.2rem; --h4-v-880: 1.4rem; --h5-v-880: 1rem; --h6-v-880: 1.1rem; --p-v-880: 1rem; --gap-880: 5.5rem; --lat-880: 3rem; --ele-880: 2rem; --btn-v-880: 1.1rem; --btn-pd-880: 4px 40px; /* --- BREAKPOINT: 1024px (Tablet Landscape/Laptop) --- */ --h1-v-1024: 2.91rem; --h2-v-1024: 1.79rem; --h3-v-1024: 1.5rem; --h4-v-1024: 1.6rem; --h5-v-1024: 1.4rem; --h6-v-1024: 1.2rem; --p-v-1024: 1rem; --gap-1024: 6rem; --lat-1024: 4rem; --ele-1024: 1.14rem; --btn-v-1024: 1.15rem;--btn-pd-1024: 4px 44px; /* --- BREAKPOINT: 1200px (Desktop Standard) --- */ --h1-v-1200: 3.4rem; --h2-v-1200: 2.1rem; --h3-v-1200: 1.8rem; --h4-v-1200: 1.8rem; --h5-v-1200: 1.5rem; --h6-v-1200: 1.3rem; --p-v-1200: 1rem; --gap-1200: 7rem; --lat-1200: 5rem; --ele-1200: 1.8rem; --btn-v-1200: 1.2rem; --btn-pd-1200: 4px 48px; /* --- BREAKPOINT: 1366px (Desktop HD) --- */ --h1-v-1366: 3.9rem; --h2-v-1366: 2.41rem; --h3-v-1366: 2rem; --h4-v-1366: 1.9rem; --h5-v-1366: 1.6rem; --h6-v-1366: 1.35rem; --p-v-1366: 1.1rem; --gap-1366: 9rem; --lat-1366: 6rem; --ele-1366: 3rem; --btn-v-1366: 1.25rem; --btn-pd-1366: 5px 52px; /* --- BREAKPOINT: 1960px (Full HD) --- */ --h1-v-1960: 4.1rem; --h2-v-1960: 2.53rem; --h3-v-1960: 2rem; --h4-v-1960: 2.2rem; --h5-v-1960: 1.8rem; --h6-v-1960: 1.5rem; --p-v-1960: 1.25rem; --gap-1960: 10rem; --lat-1960: 8rem; --ele-1960: 3.5rem; --btn-v-1960: 1.4rem; --btn-pd-1960: 6px 60px; /* --- BREAKPOINT: 2845px (Ultra Wide/4K) --- */ --h1-v-2845: 4.5rem; --h2-v-2845: 2.78rem; --h3-v-2845: 3.3rem; --h4-v-2845: 2.6rem; --h5-v-2845: 2.1rem; --h6-v-2845: 1.7rem; --p-v-2845: 1.35rem; --gap-2845: 12rem; --lat-2845: 10rem; --ele-2845: 4rem; --btn-v-2845: 1.6rem; --btn-pd-2845: 10px 70px; /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --edi-wi-cont-50: 50%; /* Width cont */ --edi-wi-cont-100: 100%; /* Width cont */ --edi-dis-dir-column: column; /* Display Flex-direction column */ --edi-dis-dir-row: row; /* Display Flex-direction row */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --altura-hero-426: 4rem; --edi-hero-order-1pos: 1; /* Order elementos hero */ --edi-hero-order-1neg: -1; /* Order elementos hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --edi-ima-h-426: 130vh; /* Altura da imagem (60vh) + Distância do scroll até ela descolar (70vh) = 130vh */ --edi-ima-h-1960: 170vh; /* Altura da imagem (100vh) + Distância do scroll até ela descolar (70vh) = 170vh */ /* SEÇÃO 3 E 5 AJUSTES GERAIS - O EDIFÍCIO 3.25rem */ --espacamento-grid-titulos-426: 1.8rem; /* Espaçamento entre textos e Cards - O Edifício */ --espacamento-grid-conteudo-426: 1.8rem; /* Espaçamento entre titulo e textos - O Edifício */ --espacamento-grid-cards-426: 1.8rem; /* Espaçamento entre Cards - O Edifício */ --espacamento-grid-icone-426: 1.8rem; /* Espaçamento entre Cards - O Edifício */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --asg-cont-h-100: 100%; /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --asg-cont-h-274: 274px; /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --asg-cont-dis-dir-row: row; /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --asg-cont-dis-dir-column: column; /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --asg-cont-wi-100: 100%; /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --asg-cont-wi-50: 50%; /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --asg-text-align-center: center; /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --asg-text-align-justify: justify; /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --asg-wrap-wrap: wrap; /* Wrap subtitulo da seção 6 introducao-inferior - O Edifício */ --asg-wrap-nowrap: nowrap; /* Wrap subtitulo da seção 6 introducao-inferior - O Edifício */ /* Larguras responsivas subtitulo da seção 6 introducao-inferior - Espaços ambientalmente responsáveis em foco. - O Edifício */ --asg-font-size-clamp-2845: clamp(2.06rem, 4.13cqi, 3.0rem); /* 2845 */ --asg-font-size-clamp-1960: clamp(1.3rem, 4.1cqi, 2.0rem); /* 1960 */ --asg-font-size-clamp-1366: clamp(1.2rem, 4.1cqi, 1.46rem); /* 1366 */ --asg-font-size-clamp-1200: clamp(1.06rem, 4.1cqi, 1.28rem); /* 1200 */ /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ --asg-font-line-height-2845: 2; /* 2845 */ --asg-font-line-height-1960: 1.9; /* 1960 */ --asg-font-line-height-1366: 1.72; /* 1366 */ --asg-font-line-height-1200: 1.64; /* 1200 */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* SEÇÃO EMPRESAS CONDÔMINOS AJUSTES GERAIS - PRINCIPAL */ --dis-dir-column: column; /* Display Flex-direction column */ --dis-dir-row: row; /* Display Flex-direction row */ /* SEÇÃO EMPRESAS CONDÔMINOS AJUSTES RESPONSIVOS - PRINCIPAL */ --wi-cont-50: 50%; /* Width Container 50% */ --wi-cont-60: 60%; /* Width Container 50% */ --wi-cont-70: 70%; /* Width Container 50% */ --wi-cont-100: 100%; /* Width Container 100% */ --wi-logo-10: 10%; /* Width Logo 70% */ --wi-logo-20: 20%; /* Width Logo 70% */ --wi-logo-30: 30%; /* Width Logo 70% */ --wi-logo-40: 40%; /* Width Logo 70% */ --wi-logo-50: 50%; /* Width Logo 70% */ --wi-logo-60: 60%; /* Width Logo 70% */ --wi-logo-70: 70%; /* Width Logo 70% */ --wi-logo-80: 80%; /* Width Logo 70% */ --wi-logo-100: 100%; /* Width Logo 100% */ --wi-cont-logo-10: 10%; /* Width Container Logo 40% */ --wi-cont-logo-20: 20%; /* Width Container Logo 40% */ --wi-cont-logo-30: 30%; /* Width Container Logo 40% */ --wi-cont-logo-40: 40%; /* Width Container Logo 40% */ --wi-cont-logo-50: 50%; /* Width Container Logo 40% */ --wi-cont-logo-60: 60%; /* Width Container Logo 60% */ --wi-cont-logo-70: 70%; /* Width Container Logo 40% */ --wi-cont-logo-80: 80%; /* Width Container Logo 80% */ --wi-cont-logo-90: 90%; /* Width Container Logo 40% */ --wi-cont-logo-100: 100%; /* Width Container Logo 100% */ --logo-loc-center: center; /* Logo Localização Center */ --logo-loc-flex-end: flex-end; /* Logo Localização Flex-end */ --wi-parc-426: 85%; /* Width Parceiros logos */ --wi-parc-2845: 88%; /* Width Parceiros logos */ --wi-parc-1960: 80%; /* Width Parceiros logos */ --wi-parc-1366: 85%; /* Width Parceiros logos */ --wi-parc-1200: 86%; /* Width Parceiros logos */ --wi-parc-1024: 86%; /* Width Parceiros logos */ --wi-parc-880: 88%; /* Width Parceiros logos */ --wi-parc-767: 85%; /* Width Parceiros logos */ --wi-parc-480: 85%; /* Width Parceiros logos */ --wi-parc-360: 85%; /* Width Parceiros logos */ } /* --- ARTICULAÇÃO DE VARIÁVEIS --- */ :root { /* Variáveis gerais */ --active-h1-exp: var(--espacamento-letras-mob); --active-text-wrap: var(--text-wrap-nowrap); /* Variáveis responsivas */ --active-h1-s: var(--h1-v-426); --active-h1-lh: var(--h1-lh-426); --active-h2-s: var(--h2-v-426); --active-h2-lh: var(--h2-lh-426); --active-h3-s: var(--h3-v-426); --active-h3-lh: var(--h3-lh-426); --active-h4-s: var(--h4-v-426); --active-h4-lh: var(--h4-lh-426); --active-h5-s: var(--h5-v-426); --active-h5-lh: var(--h5-lh-426); --active-h6-s: var(--h6-v-426); --active-h6-lh: var(--h6-lh-426); --active-p-s: var(--p-v-426); --active-p-lh: var(--p-lh-426); --active-lat: var(--lat-426); --active-ele: var(--ele-426); --active-gap: var(--gap-426); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-426); --active-btn-lh: var(--btn-lh-426); --active-btn-pd: var(--btn-pd-426); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-100); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-column); /* Display direction - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-altura-hero: var(--altura-hero-426); /* Altura Hero - O Edifício */ --active-edi-hero-order: var(--edi-hero-order-1pos); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* SEÇÃO 3 E 5 AJUSTES GERAIS - O EDIFÍCIO */ --active-espacamento-grid-titulos: var(--espacamento-grid-titulos-426); /* Espaçamento entre textos e Cards - O Edifício */ --active-espacamento-grid-conteudo: var(--espacamento-grid-conteudo-426); /* Espaçamento entre título e texto - O Edifício */ --active-espacamento-grid-cards: var(--espacamento-grid-cards-426); /* Espaçamento entre Cards - O Edifício */ --active-espacamento-grid-icones: var(--espacamento-grid-icone-426); /* Espaçamento entre ícone e títulos - O Edifício */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --active-asg-cont-h: var(--asg-cont-h-100); /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-dis-dir: var(--asg-cont-dis-dir-column); /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-espacamento: var(--ele-426); /* Espaçamento dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-wi: var(--asg-cont-wi-100); /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-text-align: var(--asg-text-align-center); /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-wrap: var(--asg-wrap-wrap); /* Wrap subtitulo da seção 6 superior - O Edifício */ --active-asg-font-size: var(--h3-v-426); /* Largura responsiva subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-line-height: var(--p-lh-426); /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-column); /* Position da imagem */ --active-wi-cont: var(--wi-cont-100); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-100); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-100); /* Width do Logo */ --active-logo-loc: var(--logo-loc-center); /* Width do Logo */ --active-wi-parc: var(--wi-parc-426); /* Width Parceiros Logos */ } /* TIPOGRAFIA GERAL - CONFIGURAÇÕES GERAIS */ body.elementor-page-540 h1{ font-weight: var(--h-weight-500); letter-spacing: var(--active-h1-exp); text-transform: uppercase; text-align: justify!important; white-space: nowrap; } body.elementor-page-540 h2{ font-weight: var(--h-weight-500); text-transform: uppercase; } body.elementor-page-540 h1, body.elementor-page-540 h2, body.elementor-page-540 h3, body.elementor-page-540 h4, body.elementor-page-540 h5, body.elementor-page-540 h6 { font-family: var(--h-font-family); color: var(--e-global-color-primary); margin: 0; } body.elementor-page-540 h3, body.elementor-page-540 h4, body.elementor-page-540 h5, body.elementor-page-540 h6 { font-weight: var(--h-weight-400); } body.elementor-page-540 p { font-family: var(--p-font-family); } /* BOTÃO - CONFIGURAÇÕES GERAIS */ body.elementor-page-540 .botao{ font-family: var(--btn-font-family) !important; font-weight: var(--btn-weight) !important; /* Personalização */ display: flex; flex-direction: row; width: max-content; height: max-content; text-decoration: none; color: #ffffff; border: none; background: linear-gradient(180deg, #01A49A 0%, #00698F 100%); background-size: auto 400%; transition: background-position 0.5s ease, box-shadow 0.4s ease !important; box-shadow: 0px 83.4606px 66.7684px rgba(0, 105, 143, 0.16), 0px 34.8698px 27.8925px rgba(0, 105, 143, 0.115), 0px 18.6451px 14.9144px rgba(0, 105, 143, 0.0954), 0px 10.4493px 8.36275px rgba(0, 105, 143, 0.08), 0px 5.55013px 4.4401px rgba(0, 105, 143, 0.0646), 0px 2.31186px 1.84448px rgba(0, 105, 143, 0.045); } body.elementor-page-540 .botao:hover { background-position: right center; /* background: linear-gradient(180deg, #00698F 0%, #01A49A 100%); */ box-shadow: 0px 100px 80px rgba(0, 105, 143, 0.26), 0px 41.78px 33.42px rgba(0, 105, 143, 0.16), 0px 22.34px 17.87px rgba(0, 105, 143, 0.15), 0px 12.52px 10.02px rgba(0, 105, 143, 0.25), 0px 6.65px 5.32px rgba(0, 105, 143, 0.09), 0px 2.77px 2.21px rgba(0, 105, 143, 0.08); } body.elementor-page-540 a:focus-visible{ outline: 2px solid var(--e-global-color-primary); outline-offset: 4px; border-radius: 0!important; } /* TIPOGRAFIA - CONFIGURAÇÕES RESPONSIVAS */ body.elementor-page-540 h1 { font-size: var(--active-h1-s) !important; line-height: var(--active-h1-lh) !important; } body.elementor-page-540 h2 { font-size: var(--active-h2-s) !important; line-height: var(--active-h2-lh) !important; } body.elementor-page-540 h3 { font-size: var(--active-h3-s) !important; line-height: var(--active-h3-lh) !important; } body.elementor-page-540 h4 { font-size: var(--active-h4-s) !important; line-height: var(--active-h4-lh) !important; } body.elementor-page-540 h5 { font-size: var(--active-h5-s) !important; line-height: var(--active-h5-lh) !important; } body.elementor-page-540 h6 { font-size: var(--active-h6-s) !important; line-height: var(--active-h6-lh) !important; } body.elementor-page-540 p { font-size: var(--active-p-s) !important; line-height: var(--active-p-lh) !important; } body.elementor-page-540 .botao{ font-size: var(--active-btn-s) !important; padding: var(--active-btn-pd) !important; line-height: var(--active-btn-lh) !important; } /* ESPAÇAMENTO ENTRE SEÇÕES - Aplicamos o Flex apenas no wrapper do conteúdo da página, ignorando o que vem do Theme Builder (Header/Footer) */ main#content .elementor, article .elementor, .elementor-location-single .elementor { display: flex !important; flex-direction: column !important; gap: var(--active-gap)!important; } /* ************************************************************ */ /* HERO O EDIFÍCIO */ /* *************** */ /* *************** */ body.elementor-page-540 .estrutura-hero-edificio{ display: flex; flex-direction: column!important; margin: 0!important; margin-top: var(--active-altura-hero)!important; gap: var(--active-espacamento-grid-cards)!important; /* Espaçamento entre contêiners */ } /* *************** */ body.elementor-page-540 .estrutura-hero-edificio p{ margin: 0!important; /* Remove o espaçamento padrão do Elementor da tag "p" */ } /* *************** */ body.elementor-page-540 .hero-conteudo-superior-edificio{ display: flex; flex-direction: var(--active-edi-dis-dir)!important; margin: 0!important; margin-left: var(--active-lat)!important; margin-right: var(--active-lat)!important; gap: var(--active-ele)!important; /* Espaçamento entre contêiners */ } /* *************** */ body.elementor-page-540 .hero-conteudo-esquerdo-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-espacamento-grid-cards)!important; /* Espaçamento entre contêiners */ width: var(--active-edi-wi-cont); } /* *************** */ body.elementor-page-540 .hero-text-esquerdo-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-espacamento-grid-cards)!important; /* Espaçamento entre contêiners */ } /* *************** */ body.elementor-page-540 .hero-imag1-edificio{ width: 100%!important; height: 100%!important; object-fit: contain!important; /* A imagem cobre a área sem distorcer */ object-position: center!important; /* Centraliza a imagem */ position: relative; z-index: -1; } /* *************** */ body.elementor-page-540 .hero-conteudo-direito-edificio{ display: flex; flex-direction: column!important; margin: 0!important; width: var(--active-edi-wi-cont); gap: var(--active-espacamento-grid-cards)!important; /* Espaçamento entre contêiners */ } /* *************** */ body.elementor-page-540 .hero-text-direito-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-espacamento-grid-cards)!important; /* Espaçamento entre contêiners */ } /* *************** */ body.elementor-page-540 .subtitulo-pagina-direito-edificio{ text-align: center!important; } /* *************** */ body.elementor-page-540 .hero-imag-conteiner-direito-edificio{ order: var(--active-edi-hero-order); } /* *************** */ body.elementor-page-540 .hero-imag2-edificio{ width: 100%!important; height: 100%!important; object-fit: contain!important; /* A imagem cobre a área sem distorcer */ object-position: center!important; /* Centraliza a imagem */ position: relative; z-index: -1; } /* *************** */ body.elementor-page-540 .hero-conteudo-inferior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; margin-left: var(--active-lat)!important; margin-right: var(--active-lat)!important; } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* ANIMAÇÃO DE SEÇÃO 1 PARA SEÇÃO 2 - CONFIGURAÇÕES - PÁGINA O EDIFÍCIO */ /* *************** */ /* Na Classe "hero-conteudo-inferior-edificio" da primeira seção colocar a Classe (Class CSS): secao1-transicao-fade-o-edificio */ /* No Conteiner da segunda seção colocar a Classe (Class CSS): secao2-transicao-o-edificio */ /* *************** */ /* Seção 1 - Hero */ @media (min-height: 600px) { .secao1-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur4 linear; animation-timeline: scroll(); animation-range: cover 0% cover 70%; /* Mobile - cover 0% cover 20% */ /* Desktop - cover 0% cover 30% */ } /* *************** */ /* Seção 2 - Missão */ .secao2-transicao-o-edificio { position: relative; z-index: 2; margin-top: 0 !important; margin-bottom: 0 !important; } } /* *************** */ /* Função da animação */ @keyframes fadeAndBlur4 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 20% { opacity: 0.9; filter: blur(0px); visibility: visible; /* transform: scale(0.9); */ } 26% { opacity: 0; filter: blur(20px); visibility: visible; /* transform: scale(0.9); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (min-width: 881px) and (max-width: 2845px) { .secao1-transicao-fade-o-edificio { animation-range: cover 0% cover 60%; } @keyframes fadeAndBlur4 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 20% { opacity: 0.9; filter: blur(0px); visibility: visible; /* transform: scale(0.9); */ } 26% { opacity: 0; filter: blur(20px); visibility: visible; /* transform: scale(0.9); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } /* SEÇÃO 2 - MISSÃO - O EDIFÍCIO*/ /* *************** */ /* *************** */ body.elementor-page-540 .sessao-video-master{ margin-top: -60vh; height: 200vh; /* margin-top: -40vh; height: 160vh; */ /* margin-top: -25vh; height: 120vh; */ position: relative; display: flex!important; justify-content: center!important; align-items: center!important; } body.elementor-page-540 .conteiner-sticky-video{ position: sticky; top: 0; height: 90vh; display: flex; flex-direction: column; justify-content: space-around; align-items: center; } body.elementor-page-540 .titulo-video{ margin-top: calc(var(--active-gap)*2); /* Altura do título */ text-align: center; z-index: 3; } body.elementor-page-540 .conteiner-sticky-video canvas{ width: 100%; height: auto; /* object-fit: contain; */ object-fit: cover; z-index: 1; margin-top: 0px !important; /* Esta ditância deve ser colocada na máscara superior "mascara-superior-secao2-video-edificio" para que se igualem as alturas */ } body.elementor-page-540 .texto-video{ display:flex; flex-direction: column; text-align: left; z-index: 3; opacity: 0; /* transform: translateY(30px); */ margin-top: 0px!important; margin-left: var(--active-lat); margin-right: var(--active-lat); gap: calc(var(--active-ele)/2); } body.elementor-page-540 .texto-video h3{ text-align: center; } body.elementor-page-540 .texto-video p{ display: flex!important; margin: 0; text-align: center; margin-bottom: 1rem!important; z-index: 999!important; } /* Contêiner da animação e das máscaras - Configurações */ body.elementor-page-540 .conteiner-ajuste-mascara{ display: flex!important; width: 100%!important; position: relative!important; justify-content: center!important; top: 0; left: 0; } /* Mobile - Configurações */ /* *************** */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ top: 0!important; position: absolute; width: 100%; height: 100px; background: linear-gradient(0deg, rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0.8) 60%, #FFFFFF 100%); z-index: 2; margin-top: 0px !important; /* Colocar aqui a ditância */ } body.elementor-page-540 .mascara-inferior-secao2-video-edificio{ bottom: 0!important; position: absolute; width: 100%; height: 100px; background: linear-gradient(0deg, #FFFFFF 20%, rgba(255, 255, 255, 0.8) 40%, rgba(255, 255, 255, 0) 100%); margin-bottom: -1px!important; /* Margem de segurança para a máscara não deixar as imagens aparecer */ z-index: 2; } /* *************** */ /* *************** */ /* *************** */ /* *************** */ body.elementor-page-540 .estrutura-hero-edificio .hero-conteudo-superior-edificio, body.elementor-page-540 .estrutura-hero-edificio .hero-conteudo-inferior-edificio{ z-index: 10!important; } @media (min-width:361px) and (max-width:426px){ body.elementor-page-540 .texto-video h3{ font-size: 1.2rem!important; } } /* ANIMAÇÃO DE SEÇÃO 2 PARA SEÇÃO 3 - CONFIGURAÇÕES - PÁGINA O EDIFÍCIO */ /* *************** */ /* No Conteiner da primeira seção colocar a Classe (Class CSS): secao2-transicao-fade-o-edificio */ /* No Conteiner da segunda seção colocar a Classe (Class CSS): secao3-transicao */ /* *************** */ /* Seção 2 - Missão */ @media (min-height: 600px) { .secao2-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur5 linear; animation-timeline: scroll(); animation-range: cover 0% cover 30%; /* Mobile - cover 0% cover 20% */ /* Desktop - cover 0% cover 30% */ } /* *************** */ /* Seção 2 - A equipe */ .secao3-transicao { position: relative; z-index: 2; margin-top: 0 !important; margin-bottom: 0 !important; } } /* *************** */ /* Função da animação */ @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 50%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (min-width:881px) and (max-width:2845px){ @media (min-height: 600px) { .secao2-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur5 linear; animation-timeline: scroll(); animation-range: cover 0% cover 35%; } } @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 70%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } /* SEÇÃO 3 - IMAGEM FIXA SUPERIOR E TÍTULO "A EQUIPE POR TRÁS DO SUCESSO */ /* *************** */ /* *************** */ /* ========================================================= 1. ESTRUTURA GERAL E DA IMAGEM ========================================================= */ .secao3-completa-mobile-edificio { position: relative; width: 100%; /* A altura total dessa seção agora será ditada automaticamente pelo bloco de cards */ } /* O SEGREDO 1: Transformamos o trilho da imagem em absoluto */ .estrutura-secao3-edificio { position: absolute; top: 0; bottom: 0; /* Isso faz o trilho da imagem ir até o final exato da seção */ left: 0; right: 0; z-index: 1; } .secao3-conteudo-edificio { position: -webkit-sticky; position: sticky; top: 0; height: 100vh; width: 100%; overflow: hidden; } /* ========================================================= 2. ESTRUTURA DOS CARDS (Trilho de rolagem) ========================================================= */ .estrutura-cards { position: relative; z-index: 3; width: 100%; /* Substituímos o margin negativo por padding. Isso define quanto você tem que rolar antes do 1º card aparecer */ padding-top: 90vh; padding-bottom: 0vh; /* Respiro final antes de ir embora */ display: flex; flex-direction: column; padding-left: var(--active-lat); padding-right: var(--active-lat); } /* *************** */ .secao3-titulo-edificio { position: absolute; top: 15%; left: 50%; transform: translate(-50%, -50%); /* Centraliza perfeitamente */ z-index: 2; /* Fica acima da imagem */ width: 100%; text-align: center; } /* *************** */ .secao3-imag-conteiner-edificio, .secao3-imag-edificio { width: 100%; height: 100%; object-fit: cover; /* Garante que a imagem não distorça */ display: block; } /* *************** */ /* .secao3-imag-conteiner-edificio{ padding-left: var(--active-lat); padding-right: var(--active-lat); } */ /* *************** */ /* *************** */ /* *************** */ /* Contêiner interno superior esquerdo */ /* *************** */ /* Contêiner Sombra CARD - Estrutura e serviços básicos */ body.elementor-page-540 .card-1{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; /* Background branco para Desktop */ /* background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); */ /* box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); */ width: var(--active-edi-wi-cont); } /* *************** */ /* *************** */ /* Contêiner interno superior direito de cima */ /* *************** */ /* Contêiner Sombra CARD - Gestão e apoio aos condôminos */ body.elementor-page-540 .card-2{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; /* Background branco para Desktop */ /* background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); */ /* box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); */ } /* *************** */ /* Contêiner interno superior direito de baixo */ /* *************** */ /* Contêiner Sombra CARD - Segurança e prevenção */ body.elementor-page-540 .card-3{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; /* Background branco para Desktop */ /* background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); */ /* box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); */ } /* *************** */ /* *************** */ /* Contêineres Inferiores */ /* *************** */ /* *************** */ /* Contêiner interno inferior esquerdo */ /* *************** */ /* Contêiner Sombra CARD - Conforto e facilidades */ body.elementor-page-540 .card-4{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; /* Background branco para Desktop */ /* background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); */ /* box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); */ width: var(--active-edi-wi-cont); } /* *************** */ /* Contêiner interno inferior direito */ /* *************** */ /* Contêiner Sombra CARD - Sustentabilidade e diferenciais */ body.elementor-page-540 .card-5{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; /* Background branco para Desktop */ /* background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); */ /* box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); */ width: var(--active-edi-wi-cont); } /* *************** */ /* *************** */ /* CONTÊINERS CONTEÚDO PARTE INTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* Contêineres Superiores */ /* *************** */ /* *************** */ /* Contêiner CARD Superior esquerdo - Estrutura e serviços básicos */ /* *************** */ /* Textos do Contêiner superior esquerdo */ body.elementor-page-540 .secao4-text-esquerdo-superior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos); /* Espaço entre texto e Cards */ margin: 0!important; padding: var(--active-espacamento-grid-titulos); background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); } /* *************** */ /* Contêiner CARD superior direito de cima - Gestão e apoio aos condôminos */ /* *************** */ /* Textos do Contêiner superior direito de cima */ body.elementor-page-540 .secao4-text-direito-superior-superior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos); /* Espaço entre texto e Cards */ margin: 0!important; padding: var(--active-espacamento-grid-titulos); background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); } /* *************** */ /* Contêiner CARD superior direito de baixo - Segurança e prevenção */ /* *************** */ /* Textos do Contêiner superior direito de baixo */ body.elementor-page-540 .secao4-text-direito-superior-inferior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos); /* Espaço entre texto e Cards */ margin: 0!important; padding: var(--active-espacamento-grid-titulos); justify-content: flex-end!important; background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); } /* *************** */ /* *************** */ /* Contêineres Inferiores */ /* *************** */ /* *************** */ /* Contêiner CARD inferior esquerdo - Conforto e facilidades */ /* *************** */ /* Textos do Contêiner inferior esquerdo */ body.elementor-page-540 .secao4-text-esquerdo-inferior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos); /* Espaço entre texto e Cards */ margin: 0!important; padding: var(--active-espacamento-grid-titulos); background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); } /* *************** */ /* Contêiner CARD inferior direito - Sustentabilidade e diferenciais */ /* *************** */ /* Textos do Contêiner inferior direito */ body.elementor-page-540 .secao4-text-direito-inferior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos); /* Espaço entre texto e Cards */ margin: 0!important; padding: var(--active-espacamento-grid-titulos); background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); } /* *************** */ /* HIFENS E ESPAÇAMENTOS PARTE INTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* CARDS Superiores */ /* *************** */ /* *************** */ /* CARD superior esquerdo */ /* *************** */ /* Hifens CARD superior esquerdo - Estrutura e serviços básicos */ body.elementor-page-540 .secao4-text-esquerdo-superior-edificio p{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.7rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD superior esquerdo - Estrutura e serviços básicos */ body.elementor-page-540 .subtitulo-secao4-esquerdo-superior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARD superior direito de cima */ /* *************** */ /* Hifens CARD superior direito de cima - Gestão e apoio aos condôminos */ body.elementor-page-540 .secao4-text-direito-superior-superior-edificio p{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.7rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD superior direito de cima - Gestão e apoio aos condôminos */ body.elementor-page-540 .subtitulo-secao4-direito-superior-superior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARD superior direito de baixo */ /* *************** */ /* Hifens CARD superior direito de baixo - Segurança e prevenção */ body.elementor-page-540 .secao4-text-direito-superior-inferior-edificio p{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.7rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD superior direito de baixo - Segurança e prevenção */ body.elementor-page-540 .subtitulo-secao4-direito-superior-inferior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARDS Inferiores */ /* *************** */ /* *************** */ /* CARD inferior direito */ /* *************** */ /* Hifens CARD inferior direito - Conforto e facilidades */ body.elementor-page-540 .secao4-text-esquerdo-inferior-edificio p{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.7rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD inferior direito - Conforto e facilidades */ body.elementor-page-540 .subtitulo-secao4-esquerdo-inferior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARD inferior esquerdo */ /* *************** */ /* Hifens CARD - Sustentabilidade e diferenciais */ body.elementor-page-540 .secao4-text-direito-inferior-edificio p{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.7rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD - Sustentabilidade e diferenciais */ body.elementor-page-540 .subtitulo-secao4-direito-inferior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* --- LAYOUT DESKTOP (Telas grandes) --- */ /* Desenhamos exatamente a estrutura que você tinha, mas usando Grid! */ .conteiner-bloco-grid { display: grid; grid-template-columns: 1fr 1fr; /* Duas colunas iguais */ gap: var(--espacamento-grid-cards-426)!important; position: relative; width: 100%; } /* O Card 1 fica na coluna da esquerda e ocupa o espaço de 2 linhas de altura */ .card-1 { grid-column: 1 / 2; grid-row: 1 / 3; } /* Os Cards 2 e 3 ficam na coluna da direita, um embaixo do outro */ .card-2 { grid-column: 2 / 3; grid-row: 1 / 2; } .card-3 { grid-column: 2 / 3; grid-row: 2 / 3; } /* Os Cards 4 e 5 ficam embaixo, lado a lado */ .card-4 { grid-column: 1 / 2; grid-row: 3 / 4; } .card-5 { grid-column: 2 / 3; grid-row: 3 / 4; } .meu-card { width: 100%!important; } @media (max-width: 880px) { .conteiner-bloco-grid { display: flex; justify-content: center!important; flex-direction: column; gap: 55vh; width: 100%!important; padding-bottom: 10vh; /* Respiro final antes de ir embora */ } /* O Card "Casca" fica invisível, mas dita a regra do Sticky */ .meu-card { position: -webkit-sticky; position: sticky; background: transparent; /* O fundo agora é transparente! */ pointer-events: none; /* Deixa o usuário clicar através do espaço vazio */ } /* O visual real do Card agora vai na div de dentro */ body.elementor-page-540 .secao4-text-esquerdo-superior-edificio, body.elementor-page-540 .secao4-text-direito-superior-superior-edificio, body.elementor-page-540 .secao4-text-direito-superior-inferior-edificio, body.elementor-page-540 .secao4-text-esquerdo-inferior-edificio, body.elementor-page-540 .secao4-text-direito-inferior-edificio{ pointer-events: auto; /* Restaura os cliques aqui dentro */ box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); background-color: #ffffff; } /* A MÁGICA: A soma do Top + Height deve ser sempre igual a 100vh! */ .card-1 { top: 20vh; height: 80vh; z-index: 11; } .card-2 { top: 30vh; height: 70vh; z-index: 12; } .card-3 { top: 40vh; height: 60vh; z-index: 13; } .card-4 { top: 50vh; height: 50vh; z-index: 14; } .card-5 { top: 60vh; height: 40vh; z-index: 15; } } @media (min-width: 881px) { .estrutura-cards { padding-bottom: 0 !important; /* Se o padding 0 não for suficiente, use uma margem negativa para encurtar o final: */ margin-bottom: 15vh; } } @media (min-width: 881px) and (max-width: 2845px) { /* *************** */ /* Contêiner interno superior esquerdo */ /* *************** */ /* Contêiner Sombra CARD - Estrutura e serviços básicos */ body.elementor-page-540 .card-1{ /* Background branco para Desktop */ background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* *************** */ /* Contêiner interno superior direito de cima */ /* *************** */ /* Contêiner Sombra CARD - Gestão e apoio aos condôminos */ body.elementor-page-540 .card-2{ /* Background branco para Desktop */ background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* Contêiner interno superior direito de baixo */ /* *************** */ /* Contêiner Sombra CARD - Segurança e prevenção */ body.elementor-page-540 .card-3{ /* Background branco para Desktop */ background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* *************** */ /* Contêineres Inferiores */ /* *************** */ /* *************** */ /* Contêiner interno inferior esquerdo */ /* *************** */ /* Contêiner Sombra CARD - Conforto e facilidades */ body.elementor-page-540 .card-4{ /* Background branco para Desktop */ background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* Contêiner interno inferior direito */ /* *************** */ /* Contêiner Sombra CARD - Sustentabilidade e diferenciais */ body.elementor-page-540 .card-5{ /* Background branco para Desktop */ background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* *************** */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (min-width: 1961px) and (max-width: 2845px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ /* *************** */ body.elementor-page-540 .sessao-video-master{ margin-top: -60vh; } body.elementor-page-540 .titulo-video{ margin-top: calc(var(--active-gap)/2); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -550px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -550px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -330px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -5vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 1701px) and (max-width: 1960px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -60vh; } body.elementor-page-540 .titulo-video{ margin-top: var(--active-gap); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -400px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -400px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -250px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -10vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 1367px) and (max-width: 1700px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -60vh; } body.elementor-page-540 .titulo-video{ margin-top: var(--active-gap); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -300px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -300px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -200px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -10vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 1201px) and (max-width: 1366px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -70vh; } body.elementor-page-540 .titulo-video{ margin-top: var(--active-gap); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -300px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -300px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -200px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -10vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 1025px) and (max-width: 1200px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -70vh; } body.elementor-page-540 .titulo-video{ margin-top: var(--active-gap); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -200px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -200px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -100px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -10vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 881px) and (max-width: 1024px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -70vh; } body.elementor-page-540 .titulo-video{ margin-top: calc(var(--active-gap)*2); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -100px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -100px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -50px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: -10vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-width: 768px) and (max-width: 880px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -70vh; height: 200vh; /* margin-top: -40vh; height: 160vh; */ /* margin-top: -25vh; height: 120vh; */ } body.elementor-page-540 .titulo-video{ margin-top: calc(var(--active-gap)*2); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -100px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -100px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -50px!important; gap: calc(var(--active-ele)/4); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: 0vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media(max-width: 360px) { /* SEÇÃO 3 - A EQUIPE - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ .conteiner-bloco-grid { margin-bottom: 15vh!important; /* Respiro final antes de ir embora */ } /* *************** */ /* *************** */ /* *************** */ /* *************** */ } @media (min-height: 50px) and (max-height: 600px) { /* SEÇÃO 2 - MISSÃO - CONFIGURAÇÕES RESPONSIVAS ESPECIAIS */ body.elementor-page-540 .sessao-video-master{ margin-top: -60vh; } body.elementor-page-540 .titulo-video{ margin-top: calc(var(--active-gap)/2); /* Altura do título */ } /* Altura braços - igual à altura máscara */ body.elementor-page-540 .conteiner-sticky-video canvas{ margin-top: -200px !important; } /* Altura máscara */ body.elementor-page-540 .mascara-superior-secao2-video-edificio{ margin-top: -200px !important; } /* Altura texto inferior */ body.elementor-page-540 .texto-video{ margin-top: -120px!important; gap: calc(var(--active-ele)/4); } /* --- LAYOUT DESKTOP (Telas grandes) --- */ /* Desenhamos exatamente a estrutura que você tinha, mas usando Grid! */ .conteiner-bloco-grid { display: grid; grid-template-columns: 1fr 1fr; /* Duas colunas iguais */ gap: var(--espacamento-grid-cards-426)!important; position: relative; width: 100%; } .meu-card { position: relative; background: transparent; /* O fundo agora é transparente! */ pointer-events: none; /* Deixa o usuário clicar através do espaço vazio */ } /* O Card 1 fica na coluna da esquerda e ocupa o espaço de 2 linhas de altura */ .card-1 { grid-column: 1 / 2!important; grid-row: 1 / 3!important; height: 100vh; top: 0!important; } /* Os Cards 2 e 3 ficam na coluna da direita, um embaixo do outro */ .card-2 { grid-column: 2 / 3!important; grid-row: 1 / 2!important; height: 100vh; top: 0!important; } .card-3 { grid-column: 2 / 3!important; grid-row: 2 / 3!important; height: 100vh; top: 0!important; } /* Os Cards 4 e 5 ficam embaixo, lado a lado */ .card-4 { grid-column: 1 / 2!important; grid-row: 3 / 4!important; height: 100vh; top: 0!important; } .card-5 { grid-column: 2 / 3!important; grid-row: 3 / 4!important; height: 100vh; top: 0!important; } } /* ANIMAÇÃO DE SEÇÃO 3 PARA SEÇÃO 4 - CONFIGURAÇÕES - PÁGINA O EDIFÍCIO */ /* *************** */ /* No Conteiner da primeira seção colocar a Classe (Class CSS): secao3-transicao-fade-o-edificio */ /* No Conteiner da segunda seção colocar a Classe (Class CSS): secao4-transicao */ /* *************** */ /* Seção 3 - A equipe */ @media (min-height: 600px) { .secao3-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur5 linear; animation-timeline: scroll(); animation-range: cover 0% cover 71%; /* Mobile - cover 0% cover 20% */ /* Desktop - cover 0% cover 30% */ } /* *************** */ /* Seção 4 - Dedicação */ .secao4-transicao { position: relative; z-index: 2; margin-top: 0 !important; margin-bottom: 0 !important; } } /* *************** */ /* Função da animação */ @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 90%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (min-width: 881px) and (max-width: 2845px) { @media (min-height: 600px) { .secao3-transicao-fade-o-edificio { animation-range: cover 0% cover 71%; } } @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 90%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } @media (min-width: 427px) and (max-width: 880px) { @media (min-height: 600px) { .secao3-transicao-fade-o-edificio { animation-range: cover 0% cover 76%; } } @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 90%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } @media (max-width: 360px) { @media (min-height: 600px) { .secao3-transicao-fade-o-edificio { animation-range: cover 0% cover 100%; } } @keyframes fadeAndBlur5 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 90%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } /* SEÇÃO 5 */ /* *************** */ /* *************** */ body.elementor-page-540 .estrutura-secao5-edificio{ margin: 0!important; } /* *************** */ body.elementor-page-540 .secao5-conteudo-edificio{ margin: 0!important; } /* *************** */ body.elementor-page-540 .secao5-text-edificio{ display: flex; flex-direction: column!important; margin-left: var(--active-lat)!important; margin-right: var(--active-lat)!important; gap: var(--active-ele)!important; } /* *************** */ body.elementor-page-540 .subtitulo-secao5-edificio{ text-align: center!important; } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* ANIMAÇÃO DE SEÇÃO 4 PARA SEÇÃO 5 - CONFIGURAÇÕES - PÁGINA O EDIFÍCIO */ /* *************** */ /* No Conteiner da primeira seção colocar a Classe (Class CSS): secao4-transicao-fade-o-edificio */ /* No Conteiner da segunda seção colocar a Classe (Class CSS): secao5-transicao */ /* *************** */ /* Seção 4 - Dedicação */ @media (min-height: 600px) { .secao4-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur6 linear; animation-timeline: scroll(); animation-range: cover 40% cover 90%; /* Mobile - cover 0% cover 20% */ /* Desktop - cover 0% cover 30% */ } /* *************** */ /* Seção 5 - ASG */ .secao5-transicao { position: relative; z-index: 2; margin-top: 0 !important; margin-bottom: 0 !important; } } /* *************** */ /* Função da animação */ @keyframes fadeAndBlur6 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 80%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO 6 - ASG PILARES - INTRODUÇÃO */ /* *************** */ /* *************** */ /* *************** */ /* CONTÊINERS INTRODUÇÃO - NOSSOS PILARES DE ASG (AMBIENTAL, SOCIAL E GOVERNANÇA)*/ /* *************** */ /* Estrutura introdução */ body.elementor-page-540 .estrutura-introducao-secao6-edificio{ display: flex; flex-direction: column!important; margin: 0!important; margin-bottom: var(--active-ele)!important; gap: var(--active-ele)!important; } /* *************** */ /* Conteiner introdução superior */ body.elementor-page-540 .secao6-conteudo-introducao-superior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; margin-left: var(--active-lat)!important; margin-right: var(--active-lat)!important; } /* *************** */ /* Titulo introdução centralização */ body.elementor-page-540 .titulo-secao6-introducao-edificio{ text-align: center!important; } /* *************** */ body.elementor-page-540 .secao6-conteudo-introducao-inferior-edificio { display: flex; margin-left: var(--active-lat); margin-right: var(--active-lat); gap: var(--active-asg-espacamento); flex-direction: var(--active-asg-cont-dis-dir); height: var(--active-asg-cont-h); } /* ******************** */ body.elementor-page-540 .secao6-imag-introducao-conteiner-edificio, .secao6-text-introducao-edificio { height: 100%; width: var(--active-asg-cont-wi); } /* ******************** */ body.elementor-page-540 .secao6-imag-introducao-conteiner-edificio img { width: 100%!important; height: 100%!important; object-fit: cover!important; } /* ******************** */ /* Imagem introdução inferior */ body.elementor-page-540 .secao6-imag-introducao-edificio{ width: 100%!important; height: 100%!important; object-fit: contain!important; object-position: center!important; position: relative; z-index: -1; } /* ******************** */ body.elementor-page-540 .secao6-text-introducao-edificio { container-type: inline-size; container-name: painel-texto; display: flex; flex-direction: column; justify-content: center!important; gap: var(--active-asg-espacamento); } /* ******************** */ body.elementor-page-540 .secao6-conteudo-introducao-inferior-edificio .subtitulo-secao6-introducao-edificio{ line-height: 1; text-align: var(--active-asg-text-align); text-align-last: var(--active-asg-text-align); white-space: var(--active-asg-wrap); font-size: var(--active-asg-font-size)!important; } /* ******************** */ body.elementor-page-540 .secao6-conteudo-introducao-inferior-edificio .paragrafo-secao6-introducao-edificio { margin: 0; line-height: var(--active-asg-line-height)!important; } /* ******************** */ /* SEÇÃO 6 - 4 CARDS */ /* *************** */ /* *************** */ /* ESTRUTURA CONTÊINERS SOMBRA PARTE EXTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* Contêineres Superiores */ /* *************** */ /* *************** */ /* Contêiner interno superior esquerdo */ /* *************** */ /* Contêiner Sombra CARD superior esquerdo - 1- Pilar ambiental */ body.elementor-page-540 .secao6-conteudo-esquerdo-superior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* Contêiner interno superior direito */ /* *************** */ /* Contêiner Sombra CARD superior direito - 2- Pilar social */ body.elementor-page-540 .secao6-conteudo-direito-superior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* *************** */ /* Contêineres Inferiores */ /* *************** */ /* *************** */ /* Contêiner interno inferior esquerdo */ /* *************** */ /* Contêiner Sombra CARD inferior esquerdo - 3- Pilar governança */ body.elementor-page-540 .secao6-conteudo-esquerdo-inferior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* Contêiner interno inferior direito */ /* *************** */ /* Contêiner Sombra CARD inferior direito - Benefícios esperados */ body.elementor-page-540 .secao6-conteudo-direito-inferior-edificio{ display: flex; flex-direction: column!important; margin: 0!important; gap: var(--active-ele)!important; background: linear-gradient(133.14deg, #FFFFFF 80.04%, #ACFFE1 159.79%); box-shadow: 0px 20px 50px rgba(5, 102, 141, 0.16); } /* *************** */ /* CONTÊINERS CONTEÚDO PARTE INTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* Contêineres Superiores */ /* *************** */ /* *************** */ /* Contêiner CARD superior esquerdo - 1- Pilar ambiental */ /* *************** */ /* Textos do quadrante superior esquerdo */ body.elementor-page-540 .secao6-text-esquerdo-superior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos)!important; /* Espaço entre texto e Cards */ } /* *************** */ /* Contêiner CARD superior direito - 2- Pilar social */ /* *************** */ /* Textos do quadrante superior direito */ body.elementor-page-540 .secao6-text-direito-superior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos)!important; /* Espaço entre texto e Cards */ } /* *************** */ /* *************** */ /* Contêineres Inferiores */ /* *************** */ /* *************** */ /* Contêiner CARD inferior esquerdo - 3- Pilar governança */ /* *************** */ /* Textos do quadrante inferior esquerdo */ body.elementor-page-540 .secao6-text-esquerdo-inferior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos)!important; /* Espaço entre texto e Cards */ } /* *************** */ /* Contêiner CARD inferior direito - Benefícios esperados */ /* *************** */ /* Textos do quadrante inferior direito */ body.elementor-page-540 .secao6-text-direito-inferior-edificio{ display: flex; flex-direction: column!important; margin: var(--active-espacamento-grid-titulos)!important; /* Espaço entre texto e Cards */ } /* *************** */ body.elementor-page-540 .secao6-text-icone-esquerdo-superior-edificio img, body.elementor-page-540 .secao6-text-icone-direito-superior-edificio img, body.elementor-page-540 .secao6-text-icone-esquerdo-inferior-edificio img, body.elementor-page-540 .secao6-text-icone-direito-inferior-edificio img { width: 40px; } /* HIFENS E ESPAÇAMENTOS PARTE INTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* CARDS Superiores */ /* *************** */ /* *************** */ /* CARD superior esquerdo */ /* *************** */ /* Hifens CARD superior esquerdo - 1 - Pilar ambiental */ body.elementor-page-540 .secao6-text-esquerdo-superior-edificio P{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.54rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD - Pilar ambiental */ body.elementor-page-540 .secao6-text-icone-esquerdo-superior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARD superior direito */ /* *************** */ /* Hifens CARD superior direito - 2 - Pilar social */ body.elementor-page-540 .secao6-text-direito-superior-edificio P{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.54rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD - Pilar social */ body.elementor-page-540 .secao6-text-icone-direito-superior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARDS Inferiores */ /* *************** */ /* *************** */ /* CARD inferior direito */ /* *************** */ /* Hifens CARD inferior direito - 3 - Pilar governança */ body.elementor-page-540 .secao6-text-esquerdo-inferior-edificio P{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.54rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD - Pilar governança */ body.elementor-page-540 .secao6-text-icone-esquerdo-inferior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* *************** */ /* CARD inferior esquerdo */ /* *************** */ /* Hifens CARD inferior esquerdo - Benefícios esperados */ body.elementor-page-540 .secao6-text-direito-inferior-edificio P{ content:""; background: url("/wp-content/uploads/2026/02/o-edificio-hifen-teste-st1.svg") no-repeat; background-position: 0rem 0.54rem; background-size: 0.4rem; padding-left: 1.4rem; } /* Espaçamento título CARD - Benefícios esperados */ body.elementor-page-540 .secao6-text-icone-direito-inferior-edificio{ margin-bottom: var(--active-espacamento-grid-conteudo)!important; /* Espaçamento entre título e texto */ } /* *************** */ /* REMOVE SETAS E ESPAÇAMENTO TÍTULO CONTEÚDO PARA AS CARDS PARTE INTERNA CARDS */ /* *************** */ /* *************** */ /* *************** */ /* Todos CARDS */ /* *************** */ /* Remove a setinha padrão do navegador */ body.elementor-page-540 .secao6-text-icone-esquerdo-superior-edificio, body.elementor-page-540 .secao6-text-icone-direito-superior-edificio, body.elementor-page-540 .secao6-text-icone-esquerdo-inferior-edificio, body.elementor-page-540 .secao6-text-icone-direito-inferior-edificio{ margin: 0!important; cursor: pointer; list-style: none; /* Remove a seta no Firefox/Chrome */ display: flex; align-items: center; gap: var(--active-espacamento-grid-icones)!important; } /* *************** */ /* Espaçamento interno entre o título e o conteúdo */ body.elementor-page-540 .secao6-conteudo-aba-esquerdo-superior-edificio, body.elementor-page-540 .secao6-conteudo-aba-direito-superior-edificio, body.elementor-page-540 .secao6-conteudo-aba-esquerdo-inferior-edificio, body.elementor-page-540 .secao6-conteudo-aba-direito-inferior-edificio{ margin-top: var(--active-espacamento-grid-icones)!important; } /* *************** */ .secao6-text-icone-esquerdo-superior-edificio::-webkit-details-marker, .secao6-text-icone-direito-superior-edificio::-webkit-details-marker, .secao6-text-icone-esquerdo-inferior-edificio::-webkit-details-marker, .secao6-text-icone-direito-inferior-edificio::-webkit-details-marker { display: none; /* Remove a seta em navegadores antigos */ } /* ============================================== ESTRUTURA GRID (A Mágica da Ordem e Altura) ============================================== */ .conteiner-4-cards { display: grid; /* No Mobile (First), é apenas 1 coluna, então 1, 2, 3, 4 ficam um embaixo do outro */ grid-template-columns: 1fr; gap: var(--espacamento-grid-cards-426)!important; /* Espaço entre Cards */ /* O SEGREDO: Impede que o card estique a altura do vizinho! */ align-items: start; width: 100%; padding-right: var(--active-lat)!important; padding-left: var(--active-lat)!important; /*max-width: 1000px; */ /* margin: 0 auto; */ } /* Telas Maiores: Vira 2 colunas perfeitamente alinhadas (1 e 2 em cima, 3 e 4 embaixo) */ @media (min-width: 768px) { .conteiner-4-cards { grid-template-columns: 1fr 1fr; } } /* ============================================== ESTILO E ANIMAÇÃO DO DETAILS / SUMMARY ============================================== */ /* O conteúdo invisível esperando para ser aberto */ .card-conteudo { padding: 0 20px; /* Padding apenas horizontal no início */ max-height: 0; opacity: 0; transform: translateY(-10px); overflow: hidden; /* A transição suave apenas com CSS */ transition: max-height 0.4s ease, opacity 0.4s ease, transform 0.4s ease, padding 0.4s ease; } /* Quando o details recebe o atributo [open] (ao clicar) */ .card-expansivel[open] .card-conteudo { padding: 0 20px 20px 20px; /* Adiciona o padding inferior suavemente */ max-height: 800px; /* Um valor alto para caber qualquer texto seu */ opacity: 1; transform: translateY(0); } /* TRANSIÇÃO DE SEÇÃO 5 PARA SEÇÃO EMPRESAS CONDÔMINOS - CONFIGURAÇÕES */ /* *************** */ /* No Conteiner da primeira seção colocar a Classe (Class CSS): secao3-transicao-sticky-fade */ /* No Conteiner da segunda seção colocar a Classe (Class CSS): secao-empresas-transicao */ /* *************** */ /* Seção 3 - Obra Prima */ @media (min-height: 600px) { .secao5-transicao-fade-o-edificio { /* position: sticky !important; */ top: 0; z-index: 1; animation-fill-mode: both !important; animation: fadeAndBlur7 linear; animation-timeline: scroll(); animation-range: cover 70% cover 88%; } /* *************** */ /* Seção - Empresas Condôminos */ .secao-empresas-transicao-o-edificio { position: relative; z-index: 2; margin-top: 0 !important; margin-bottom: 0 !important; } } /* *************** */ /* Função da animação */ @keyframes fadeAndBlur7 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 85%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (max-width: 360px) { @media (min-height: 600px) { /* Seção 3 - Obra Prima */ .secao5-transicao-fade-o-edificio { animation-range: cover 70% cover 96%; } } @keyframes fadeAndBlur7 { 0%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 85%{ opacity: 1; filter: blur(0px); visibility: visible; /* transform: scale(1); */ } 100% { opacity: 0; filter: blur(20px); visibility: hidden; /* transform: scale(0.9); */ } } } /* SEÇÃO EMPRESAS CONDÔMINOS */ /* *************** */ /* *************** */ body.elementor-page-540 .estrutura-secao4-principal{ margin-bottom: var(--active-ele); } body.elementor-page-540 .secao4-conteudo-principal{ display: flex; flex-direction: var(--active-dis-dir); justify-content: space-between!important; margin-left: var(--active-lat); margin-right: var(--active-lat); gap: var(--active-ele); } body.elementor-page-540 .secao4-text-principal{ display: flex; flex-direction: column; /* width: var(--active-wi-cont); */ gap: var(--active-ele); } body.elementor-page-540 .titulo-secao4-principal{ margin-bottom: -0.625rem!important; text-align: left; } body.elementor-page-540 .paragrafo-secao4-principal{ margin-bottom: -0.5rem; } body.elementor-page-540 .logo-cnseg{ width: var(--active-wi-logo)!important; /* width: 400px!important; */ /*width: 100%;*/ height: 100%; object-fit: contain; object-position: center; position: relative; } body.elementor-page-540 picture.logo-cnseg{ width: var(--active-wi-logo); } body.elementor-page-540 .empresa-principal{ display: flex; justify-content: var(--active-logo-loc); align-items: center; width: var(--active-wi-cont-logo); /*width: var(--active-wi-cont);*/ } /* *************** */ /* *************** */ body.elementor-page-540 .empresas-condominos-1 { display: flex; align-items: center; width: 100%; max-width: var(--active-wi-parc); margin-inline: auto; position: relative; height: 100px; /* margin-top: calc(var(--active-ele)); */ margin-bottom: calc(var(--active-ele)); overflow: hidden; mask-image: linear-gradient( to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) ); } body.elementor-page-540 .empresas-condominos-2 { width: 100%; max-width: var(--active-wi-parc); margin-inline: auto; position: relative; height: 70px; margin-top: 0; overflow: hidden; mask-image: linear-gradient( to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) ); } @keyframes scrollLeft { to { left: -200px; } } @keyframes scrollRight { to { right: -200px; } } body.elementor-page-540 .empresas1 img { width: 200px; /* height: 68px; */ height: 62.5px; background-color: transparent; border-radius: 6px; position: absolute; transform: translateY(-30px); left: max(calc(280px * 5), 100%); animation-name: scrollLeft; animation-duration: 30s; animation-timing-function: linear; animation-iteration-count: infinite; } body.elementor-page-540 .empresas2 img { width: 200px; /* height: 68px; */ height: 62.5px; background-color: transparent; border-radius: 6px; position: absolute; right: max(calc(200px * 4), 100%); animation-name: scrollRight; animation-duration: 30s; animation-timing-function: linear; animation-iteration-count: infinite; } body.elementor-page-540 .empresa1 img{ height: 88px; transform: translateY(-50px); animation-delay: calc(30s / 5 * (5 - 1) * -1); } body.elementor-page-540 .empresa2 img{ animation-delay: calc(30s / 5 * (5 - 2) * -1); } body.elementor-page-540 .empresa3 img{ animation-delay: calc(30s / 5 * (5 - 3) * -1); } body.elementor-page-540 .empresa4 img{ animation-delay: calc(30s / 5 * (5 - 4) * -1); } body.elementor-page-540 .empresa5 img{ animation-delay: calc(30s / 5 * (5 - 5) * -1); } body.elementor-page-540 .empresa6 img{ animation-delay: calc(30s / 4 * (4 - 1) * -1); } body.elementor-page-540 .empresa7 img{ animation-delay: calc(30s / 4 * (4 - 2) * -1); } body.elementor-page-540 .empresa8 img{ animation-delay: calc(30s / 4 * (4 - 3) * -1); } body.elementor-page-540 .empresa9 img{ animation-delay: calc(30s / 4 * (4 - 4) * -1); } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* SEÇÃO CONTATO */ /* *************** */ /* *************** */ body.elementor-page-540 .estrutura-secao5-principal{ /* margin: 0!important; */ margin-bottom: var(--active-gap)!important; /* margin-bottom: 0!important; */ } body.elementor-page-540 .secao5-conteudo-principal{ margin: 0!important; } body.elementor-page-540 .secao5-text-principal{ display: flex; flex-direction: column!important; align-items: center!important; margin-left: var(--active-lat)!important; margin-right: var(--active-lat)!important; gap: var(--active-ele)!important; } body.elementor-page-540 .titulo-secao5-principal{ text-align: center!important; } /* *************** */ /* *************** */ /* *************** */ /* *************** */ /* F I M C O N F I G U R A Ç Õ E S E S P E C Í F I C A S D O S I T E */ /* *************** */ /* *************** */ /* *************** */ /* *************** */ @media (min-width:1961px) and (max-width:2845px){ :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-2845); --active-h2-s: var(--h2-v-2845); --active-h3-s: var(--h3-v-2845); --active-h4-s: var(--h4-v-2845); --active-h5-s: var(--h5-v-2845); --active-h6-s: var(--h6-v-2845); --active-p-s: var(--p-v-2845); --active-lat: var(--lat-2845); --active-ele: var(--ele-2845); --active-gap: var(--gap-2845); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-2845); --active-btn-pd: var(--btn-pd-2845); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-50); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-row); /* Display direction hero - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-hero-order: var(--edi-hero-order-1neg); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-1960); /* Altura da imagem + Distância do scroll até ela descolar */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --active-asg-cont-h: var(--asg-cont-h-274); /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-dis-dir: var(--asg-cont-dis-dir-row); /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-espacamento: var(--active-espacamento-grid-conteudo); /* Espaçamento dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-wi: var(--asg-cont-wi-50); /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-text-align: var(--asg-text-align-justify); /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-wrap: var(--asg-wrap-nowrap); /* Wrap subtitulo da seção 6 superior - O Edifício */ --active-asg-font-size: var(--asg-font-size-clamp-2845)!important; /* Largura responsiva subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-line-height: var(--asg-font-line-height-2845); /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-50); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-70); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-40); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-2845); /* Width Parceiros Logos */ } } /* 1367px a 1960px */ @media (min-width: 1367px) and (max-width: 1960px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-1960); --active-h2-s: var(--h2-v-1960); --active-h3-s: var(--h3-v-1960); --active-h4-s: var(--h4-v-1960); --active-h5-s: var(--h5-v-1960); --active-h6-s: var(--h6-v-1960); --active-p-s: var(--p-v-1960); --active-lat: var(--lat-1960); --active-ele: var(--ele-1960); --active-gap: var(--gap-1960); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-1960); --active-btn-pd: var(--btn-pd-1960); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-50); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-row); /* Display direction hero - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-hero-order: var(--edi-hero-order-1neg); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-1960); /* Altura da imagem + Distância do scroll até ela descolar */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --active-asg-cont-h: var(--asg-cont-h-274); /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-dis-dir: var(--asg-cont-dis-dir-row); /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-espacamento: var(--active-espacamento-grid-conteudo); /* Espaçamento dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-wi: var(--asg-cont-wi-50); /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-text-align: var(--asg-text-align-justify); /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-wrap: var(--asg-wrap-nowrap); /* Wrap subtitulo da seção 6 superior - O Edifício */ --active-asg-font-size: var(--asg-font-size-clamp-1960)!important; /* Largura responsiva subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-line-height: var(--asg-font-line-height-1960); /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-50); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-70); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-80); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-1960); /* Width Parceiros Logos */ } } /* 1201px a 1366px */ @media (min-width: 1201px) and (max-width: 1366px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-1366); --active-h2-s: var(--h2-v-1366); --active-h3-s: var(--h3-v-1366); --active-h4-s: var(--h4-v-1366); --active-h5-s: var(--h5-v-1366); --active-h6-s: var(--h6-v-1366); --active-p-s: var(--p-v-1366); --active-lat: var(--lat-1366); --active-ele: var(--ele-1366); --active-gap: var(--gap-1366); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-1366); --active-btn-pd: var(--btn-pd-1366); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-50); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-row); /* Display direction hero - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-hero-order: var(--edi-hero-order-1neg); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-1960); /* Altura da imagem + Distância do scroll até ela descolar */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --active-asg-cont-h: var(--asg-cont-h-274); /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-dis-dir: var(--asg-cont-dis-dir-row); /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-espacamento: var(--active-espacamento-grid-conteudo); /* Espaçamento dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-wi: var(--asg-cont-wi-50); /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-text-align: var(--asg-text-align-justify); /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-wrap: var(--asg-wrap-nowrap); /* Wrap subtitulo da seção 6 superior - O Edifício */ --active-asg-font-size: var(--asg-font-size-clamp-1366)!important; /* Largura responsiva subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-line-height: var(--asg-font-line-height-1366); /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-60); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-100); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-30); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-1366); /* Width Parceiros Logos */ } } /* 1025px a 1200px */ @media (min-width: 1025px) and (max-width: 1200px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-1200); --active-h2-s: var(--h2-v-1200); --active-h3-s: var(--h3-v-1200); --active-h4-s: var(--h4-v-1200); --active-h5-s: var(--h5-v-1200); --active-h6-s: var(--h6-v-1200); --active-p-s: var(--p-v-1200); --active-lat: var(--lat-1200); --active-ele: var(--ele-1200); --active-gap: var(--gap-1200); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-1200); --active-btn-pd: var(--btn-pd-1200); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-50); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-row); /* Display direction hero - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-hero-order: var(--edi-hero-order-1neg); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* SEÇÃO 6 AJUSTES GERAIS - O EDIFÍCIO */ --active-asg-cont-h: var(--asg-cont-h-274); /* Altura do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-dis-dir: var(--asg-cont-dis-dir-row); /* Flex-direction do contêiner da seção 6 introducao-inferior - O Edifício */ --active-asg-espacamento: var(--active-espacamento-grid-conteudo); /* Espaçamento dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-cont-wi: var(--asg-cont-wi-50); /* Width dos contêiners internos da seção 6 introducao-inferior - O Edifício */ --active-asg-text-align: var(--asg-text-align-justify); /* Alinhamento subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-wrap: var(--asg-wrap-nowrap); /* Wrap subtitulo da seção 6 superior - O Edifício */ --active-asg-font-size: var(--asg-font-size-clamp-1200)!important; /* Largura responsiva subtitulo da seção 6 introducao-inferior - O Edifício */ --active-asg-line-height: var(--asg-font-line-height-1200); /* Line-height responsivo do parágrafo da seção 6 introducao-inferior - O Edifício */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-60); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-90); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-30); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-1200); /* Width Parceiros Logos */ } } /* 881px a 1024px */ @media (min-width: 881px) and (max-width: 1024px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-1024); --active-h2-s: var(--h2-v-1024); --active-h3-s: var(--h3-v-1024); --active-h4-s: var(--h4-v-1024); --active-h5-s: var(--h5-v-1024); --active-h6-s: var(--h6-v-1024); --active-p-s: var(--p-v-1024); --active-lat: var(--lat-1024); --active-ele: var(--ele-1024); --active-gap: var(--gap-1024); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-1024); --active-btn-pd: var(--btn-pd-1024); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-wi-cont: var(--edi-wi-cont-50); /* Width cont hero */ --active-edi-dis-dir: var(--edi-dis-dir-row); /* Display direction hero - O Edifício */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ --active-edi-hero-order: var(--edi-hero-order-1neg); /* Width cont hero */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-60); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-90); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-40); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-1024); /* Width Parceiros Logos */ } } /* 768px a 880px */ @media (min-width: 768px) and (max-width: 880px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-880); --active-h2-s: var(--h2-v-880); --active-h3-s: var(--h3-v-880); --active-h4-s: var(--h4-v-880); --active-h5-s: var(--h5-v-880); --active-h6-s: var(--h6-v-880); --active-p-s: var(--p-v-880); --active-lat: var(--lat-880); --active-ele: var(--ele-880); --active-gap: var(--gap-880); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-880); --active-btn-pd: var(--btn-pd-880); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-60); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-90); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-40); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-880); /* Width Parceiros Logos */ } } /* 481px a 767px */ @media (min-width: 481px) and (max-width: 767px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-767); --active-h2-s: var(--h2-v-767); --active-h3-s: var(--h3-v-767); --active-h4-s: var(--h4-v-767); --active-h5-s: var(--h5-v-767); --active-h6-s: var(--h6-v-767); --active-p-s: var(--p-v-767); --active-lat: var(--lat-767); --active-ele: var(--ele-767); --active-gap: var(--gap-767); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-767); --active-btn-pd: var(--btn-pd-767); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-row); /* Position da imagem */ --active-wi-cont: var(--wi-cont-60); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-100); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-40); /* Width do Logo */ --active-logo-loc: var(--logo-loc-flex-end); /* Width do Logo */ --active-wi-parc: var(--wi-parc-767); /* Width Parceiros Logos */ } } /* 427px a 480px */ @media (min-width: 427px) and (max-width: 480px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-480); --active-h2-s: var(--h2-v-480); --active-h3-s: var(--h3-v-480); --active-h4-s: var(--h4-v-480); --active-h5-s: var(--h5-v-480); --active-h6-s: var(--h6-v-480); --active-p-s: var(--p-v-480); --active-lat: var(--lat-480); --active-ele: var(--ele-480); --active-gap: var(--gap-480); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-480); --active-btn-pd: var(--btn-pd-480); --active-h1-exp: var(--espacamento-letras-mob); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-column); /* Position da imagem */ --active-wi-cont: var(--wi-cont-100); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-100); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-100); /* Width do Logo */ --active-logo-loc: var(--logo-loc-center); /* Width do Logo */ --active-wi-parc: var(--wi-parc-480); /* Width Parceiros Logos */ } } /* MENORES QUE 360px clamp(1.4rem, 10vw, var(--h1-v-426)) */ @media (max-width: 360px) { :root { /* Variáveis responsivas */ --active-h1-s: var(--h1-v-360); --active-h2-s: var(--h2-v-360); --active-h3-s: var(--h3-v-360); --active-h4-s: var(--h4-v-360); --active-h5-s: var(--h5-v-360); --active-h6-s: var(--h6-v-360); --active-p-s: var(--p-v-360); --active-lat: var(--lat-360); --active-ele: var(--ele-360); --active-gap: var(--gap-360); /* Variáveis do Botão */ --active-btn-s: var(--btn-v-360); --active-btn-pd: var(--btn-pd-360); --active-h1-exp: var(--espacamento-letras-mob); /* --- P Á G I N A O E D I F Í C I O --- */ /* --- CONFIGURAÇÕES ESPECIAIS DE SEÇÕES --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* HERO AJUSTES GERAIS - O EDIFÍCIO */ /* SEÇÃO 3 AJUSTE MÁXIMA ALTURA CARDS - O EDIFÍCIO */ --active-edi-ima-h: var(--edi-ima-h-426); /* Altura da imagem + Distância do scroll até ela descolar */ /* --- F I M P Á G I N A O E D I F Í C I O --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* --- ****************** --- */ /* Seção Empresas condôminos - Principal */ --active-dis-dir: var(--dis-dir-column); /* Position da imagem */ --active-wi-cont: var(--wi-cont-100); /* Width do Conteiner */ --active-wi-logo: var(--wi-logo-100); /* Width do Logo */ --active-wi-cont-logo: var(--wi-cont-logo-100); /* Width do Logo */ --active-logo-loc: var(--logo-loc-center); /* Width do Logo */ --active-wi-parc: var(--wi-parc-360); /* Width Parceiros Logos */ } }/* End custom CSS */