/* ═══════════════════════════════════════════════ GRUPO REALIZA - CSS GLOBAL Importar em Elementor > Custom CSS ou ═══════════════════════════════════════════════ */ @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap'); :root { --gr-dark: #050b14; --gr-navy: #0f172a; --gr-slate: #334155; --gr-blue: #22d3ee; --gr-gray: #94a3b8; --gr-atto-dark: #0f2d37; --gr-atto-accent: #d4c190; --gr-vohn-dark: #05293d; --gr-vohn-accent: #5aa9e6; --gr-unic-blue: #0077b6; } body { font-family: 'Montserrat', sans-serif !important; } html, body { max-width: 100%; overflow-x: hidden !important; } .elementor, .grupo-realiza-page { overflow-x: hidden; } .elementor-section, .elementor-column, .elementor-widget { font-family: 'Montserrat', sans-serif !important; } .grupo-realiza-page .elementor-section.elementor-section-boxed > .elementor-container, .grupo-realiza-page .elementor-section > .elementor-container, .grupo-realiza-page .elementor-container, .grupo-realiza-page .elementor-column, .grupo-realiza-page .elementor-widget-wrap, .grupo-realiza-page .elementor-widget, .grupo-realiza-page .elementor-widget-container { width: 100% !important; max-width: none !important; } .grupo-realiza-page .elementor-column-gap-default > .elementor-column > .elementor-element-populated, .grupo-realiza-page .elementor-widget-wrap, .grupo-realiza-page .elementor-widget-container { padding-left: 0 !important; padding-right: 0 !important; } .grupo-realiza-page header { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; box-sizing: border-box !important; } /* ─── SCROLLBAR ─── */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: var(--gr-dark); } ::-webkit-scrollbar-thumb { background: var(--gr-navy); border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: var(--gr-blue); } /* ─── ANIMAÇÕES ─── */ @keyframes gr-fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes gr-slideUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } } @keyframes gr-slideLeft { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: translateX(0); } } @keyframes gr-scaleIn { from { opacity: 0; transform: scale(.95); } to { opacity: 1; transform: scale(1); } } @keyframes gr-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .7; } } @keyframes gr-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .gr-animate-fade { animation: gr-fadeIn .7s ease forwards; } .gr-animate-slide { animation: gr-slideUp .8s ease forwards; } .gr-animate-slide-left { animation: gr-slideLeft .8s ease forwards; } .gr-animate-scale { animation: gr-scaleIn .6s ease forwards; } .gr-animate-float { animation: gr-float 3s ease-in-out infinite; } /* ─── HOVER EFFECTS ─── */ .gr-hover-zoom img { transition: transform 2.6s cubic-bezier(.22, 1, .36, 1), opacity 1.1s ease !important; } .gr-hover-zoom:hover img { transform: scale(1.012); opacity: 1 !important; } .gr-hover-glow { transition: box-shadow .75s ease, border-color .75s ease; } .gr-hover-glow:hover { box-shadow: 0 14px 36px rgba(34, 211, 238, .08); } .gr-hover-lift { transition: transform .7s cubic-bezier(.22, 1, .36, 1), box-shadow .7s ease; } .gr-hover-lift:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(0,0,0,.22); } .gr-hover-border { transition: border-color .75s ease; } .gr-hover-border-atto:hover { border-color: rgba(212, 193, 144, .28) !important; } .gr-hover-border-vohn:hover { border-color: rgba(90, 169, 230, .28) !important; } .gr-hover-border-unic:hover { border-color: rgba(0, 119, 182, .28) !important; } .gr-hover-border-blue:hover { border-color: rgba(34, 211, 238, .28) !important; } .gr-icon-hover { transition: transform .55s ease, opacity .55s ease; } .gr-icon-hover:hover { transform: scale(1.06); opacity: .9; } /* ─── BRAND CARDS ─── */ .gr-brand-card { transition: transform .75s cubic-bezier(.22, 1, .36, 1), background .75s ease, border-color .75s ease, box-shadow .75s ease; backdrop-filter: blur(4px); cursor: pointer; } .gr-brand-card:hover { background: rgba(255,255,255,.035) !important; transform: translateY(-2px); box-shadow: 0 18px 44px rgba(0,0,0,.18); } .gr-brand-card:hover h3 { letter-spacing: 4px !important; } .gr-brand-card h3 { transition: letter-spacing .75s ease; } /* ─── PROPERTY CARDS ─── */ .gr-property-card { position: relative; overflow: hidden; cursor: pointer; transition: border-color .75s ease, transform .75s cubic-bezier(.22, 1, .36, 1), box-shadow .75s ease; } .gr-property-card:hover { border-color: rgba(34, 211, 238, .22) !important; transform: translateY(-2px); box-shadow: 0 18px 42px rgba(0,0,0,.22); } .gr-property-card img { transition: transform 2.6s cubic-bezier(.22, 1, .36, 1), opacity 1.1s ease !important; } .gr-property-card:hover img { transform: scale(1.012); } .gr-property-card .gr-card-details { opacity: 0; transform: translateY(10px); transition: opacity .65s ease, transform .65s ease; } .gr-property-card:hover .gr-card-details { opacity: 1; transform: translateY(0); } /* ─── GALLERY SCROLL ─── */ .gr-gallery-scroll { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: 16px; } .gr-gallery-scroll::-webkit-scrollbar { height: 4px; } .gr-gallery-scroll::-webkit-scrollbar-thumb { background: var(--gr-slate); border-radius: 2px; } .gr-gallery-scroll > * { scroll-snap-align: start; flex-shrink: 0; } /* ─── BUTTONS ─── */ .gr-btn-outline { border: 1px solid var(--gr-blue); color: var(--gr-blue); background: transparent; padding: 12px 32px; font-size: 11px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; cursor: pointer; transition: background .55s ease, color .55s ease, border-color .55s ease, transform .55s ease; } .gr-btn-outline:hover { background: var(--gr-blue); color: var(--gr-dark); transform: translateY(-1px); } .gr-btn-solid { background: var(--gr-blue); color: var(--gr-dark); border: none; padding: 14px 32px; font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; font-family: 'Montserrat', sans-serif; cursor: pointer; transition: background .55s ease, color .55s ease, opacity .55s ease, transform .55s ease; } .gr-btn-solid:hover { background: #fff; transform: translateY(-1px); } .gr-btn-atto { border-color: var(--gr-atto-accent); color: var(--gr-atto-accent); } .gr-btn-atto:hover { background: var(--gr-atto-accent); color: var(--gr-atto-dark); } .gr-btn-vohn { border-color: var(--gr-vohn-accent); color: var(--gr-vohn-accent); } .gr-btn-vohn:hover { background: var(--gr-vohn-accent); color: var(--gr-vohn-dark); } .gr-btn-unic { background: var(--gr-unic-blue); color: #fff; border: none; } .gr-btn-unic:hover { opacity: .9; } /* ─── NAV STICKY ─── */ .gr-nav-sticky { position: fixed !important; top: 0; left: 0; right: 0; z-index: 999; transition: all .7s; background: rgba(5, 11, 20, .95); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,.05); } /* ─── POPUP/MODAL ─── */ .gr-modal-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,.85); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; animation: gr-fadeIn .3s ease; } /* ─── GRAYSCALE HOVER ─── */ .gr-grayscale { filter: grayscale(100%); transition: filter 1.25s ease, transform 1.25s ease; } .gr-grayscale:hover { filter: grayscale(0%); } /* ─── GRADIENT OVERLAYS ─── */ .gr-gradient-hero { background: linear-gradient(to bottom, rgba(5,11,20,.7), rgba(5,11,20,.14) 34%, rgba(5,11,20,.26) 66%, var(--gr-dark)) !important; } .gr-gradient-bottom { background: linear-gradient(to top, rgba(0,0,0,.9), transparent) !important; } .gr-gradient-right { background: linear-gradient(to right, var(--gr-dark), rgba(5,11,20,.5), transparent) !important; } body.wp-theme-grupo-realiza header > img, body.wp-theme-grupo-realiza header > div:first-child > img { object-position: center 62% !important; transition: transform 2.2s cubic-bezier(.22, 1, .36, 1), opacity .9s ease !important; } body.home.wp-theme-grupo-realiza header > div:first-child > img { object-position: center 68% !important; opacity: .52 !important; filter: grayscale(18%) saturate(.95) !important; } body.wp-theme-grupo-realiza:not(.home) header > img { object-position: center 78% !important; opacity: .56 !important; } body.wp-theme-grupo-realiza header > img + div { opacity: .62 !important; } body.home.wp-theme-grupo-realiza header .gr-hero-title, body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title { color: #f8fafc !important; text-shadow: 0 10px 32px rgba(0,0,0,.34) !important; } body.home.wp-theme-grupo-realiza header .gr-hero-title span { color: #dbeafe !important; } body.home.wp-theme-grupo-realiza header .gr-hero-title + p, body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title + p { color: #e2e8f0 !important; text-shadow: 0 8px 26px rgba(0,0,0,.32) !important; } .gr-social-links { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin: 28px auto 0; } .gr-social-links a { color: var(--gr-gray); border: 1px solid rgba(148, 163, 184, .22); padding: 9px 14px; text-decoration: none; font-size: 10px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; transition: color .55s ease, border-color .55s ease, background .55s ease, transform .55s ease; } .gr-social-links a:hover { color: var(--gr-blue); border-color: rgba(34, 211, 238, .42); background: rgba(34, 211, 238, .045); transform: translateY(-1px); } /* ─── RESPONSIVE ─── */ @media (max-width: 1024px) { .gr-hero-title { font-size: 42px !important; } .gr-brand-cards { grid-template-columns: 1fr !important; } .gr-stats-grid { grid-template-columns: 1fr !important; gap: 32px !important; } } @media (max-width: 768px) { .gr-hero-title { font-size: 32px !important; } .gr-section-title { font-size: 28px !important; } .gr-about-grid { grid-template-columns: 1fr !important; } .gr-footer-grid { grid-template-columns: 1fr !important; } .gr-property-grid { grid-template-columns: 1fr !important; } .gr-nav-links { display: none !important; } .gr-nav-mobile-toggle { display: block !important; } .gr-contact-grid { grid-template-columns: 1fr !important; } .gr-features-grid { grid-template-columns: 1fr !important; } } /* ─── WHATSAPP FLOAT ─── */ .gr-whatsapp-float { position: fixed; bottom: 32px; right: 32px; z-index: 998; background: #25D366; color: #fff; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(37, 211, 102, .4); cursor: pointer; transition: transform .3s; font-size: 28px; } .gr-whatsapp-float:hover { transform: scale(1.04); } /* ─── FORM STYLES ─── */ .gr-form input, .gr-form textarea, .gr-form select { width: 100%; background: var(--gr-dark) !important; border: 1px solid var(--gr-slate) !important; padding: 14px !important; color: #fff !important; font-size: 14px; font-family: 'Montserrat', sans-serif; outline: none; transition: border-color .3s; } .gr-form input:focus, .gr-form textarea:focus, .gr-form select:focus { border-color: var(--gr-blue) !important; } .gr-form label { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--gr-gray); margin-bottom: 8px; display: block; } /* ─── IMAGE GALLERY CAROUSEL ─── */ .gr-carousel-container { position: relative; overflow: hidden; } .gr-carousel-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.4); color: #fff; border: none; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; font-size: 18px; z-index: 10; transition: background .55s ease, transform .55s ease; } .gr-carousel-nav:hover { background: rgba(0,0,0,.62); transform: translateY(-50%) scale(1.03); } .gr-carousel-prev { left: 16px; } .gr-carousel-next { right: 16px; } .gr-carousel-dots { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; z-index: 10; } .gr-carousel-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.4); transition: background .45s ease, transform .45s ease; cursor: pointer; } .gr-carousel-dot.active { background: var(--gr-blue); } /* ─── BRAND ASSETS / RESPONSIVE FIXES ─── */ .gr-nav-logo-wrap { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; transition: opacity .55s ease, transform .55s ease; } .gr-nav-logo-wrap:hover { opacity: .92; transform: translateY(-1px); } .gr-nav-logo-mark { width: 38px; height: 28px; object-fit: contain; display: block; } .gr-nav-logo-wrap > span { color: var(--gr-blue); font-size: 16px; font-weight: 700; letter-spacing: 5px; line-height: 1; } .gr-brand-logo { display: block; width: min(180px, 80%); max-height: 54px; object-fit: contain; margin: 0 auto 10px; } .gr-footer-logo { display: block; width: 190px; max-width: 100%; max-height: 58px; object-fit: contain; object-position: left center; margin-bottom: 16px; } .gr-property-brand-logo { position: absolute; right: 18px; top: 18px; z-index: 2; width: 84px; max-height: 34px; object-fit: contain; filter: drop-shadow(0 8px 18px rgba(0,0,0,.45)); } .gr-modal-brand-logo { display: block; width: 150px; max-height: 46px; object-fit: contain; object-position: left center; margin-bottom: 18px; } @media (max-width: 900px) { .gr-modal-grid { grid-template-columns: 1fr !important; padding: 28px !important; } .gr-carousel-container { height: 46vh !important; } } @media (max-width: 768px) { .gr-main-nav { padding: 14px 18px !important; width: 100vw !important; box-sizing: border-box !important; overflow: hidden !important; justify-content: flex-start !important; gap: 12px !important; } .gr-main-nav > div, .gr-main-nav > div:last-child { width: 100% !important; max-width: 100% !important; display: flex !important; justify-content: center !important; align-items: center !important; margin: 0 !important; } .gr-main-nav .gr-nav-links, .gr-main-nav > div > div:last-child { display: none !important; } .gr-main-nav > div > a { display: inline-flex !important; position: relative !important; left: auto !important; top: auto !important; z-index: 1001 !important; margin: 0 auto !important; max-width: calc(100vw - 100px) !important; overflow: hidden !important; } .gr-nav-logo-wrap { gap: 8px; font-size: 13px; letter-spacing: 2px; } .gr-nav-logo-mark { width: 30px; height: 22px; } .gr-nav-logo-wrap > span { font-size: 12px; letter-spacing: 3px; } .gr-hero-title { font-size: 26px !important; max-width: calc(100vw - 36px) !important; margin-left: auto !important; margin-right: auto !important; overflow-wrap: normal !important; } .gr-brand-cards { width: 100% !important; max-width: calc(100vw - 42px) !important; margin-left: auto !important; margin-right: auto !important; box-sizing: border-box !important; } .gr-brand-card { box-sizing: border-box !important; width: 100% !important; padding: 20px !important; } .gr-brand-logo { width: min(170px, 88%) !important; max-height: 48px !important; } #imoveis-atualizados { padding: 64px 20px !important; } .gr-property-grid { grid-template-columns: 1fr !important; } .gr-property-card { min-height: 420px !important; } .gr-property-brand-logo { width: 74px; max-height: 30px; } .gr-modal-content { width: 96vw !important; max-height: 92vh !important; } .gr-carousel-container { height: 40vh !important; } body.home.wp-theme-grupo-realiza header > div:first-child > img, body.wp-theme-grupo-realiza:not(.home) header > img { object-position: center 64% !important; } body.wp-theme-grupo-realiza:not(.home) header { min-height: 92svh !important; align-items: stretch !important; } body.wp-theme-grupo-realiza:not(.home) header > div[style*="max-width:600px"] { min-height: 92svh !important; width: 100% !important; max-width: min(100vw, 560px) !important; padding: 104px 28px 118px !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: flex-start !important; text-align: left !important; } body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title { font-size: 42px !important; line-height: 1.06 !important; max-width: 100% !important; margin-bottom: 22px !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title + p { max-width: 100% !important; font-size: 17px !important; line-height: 1.62 !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } .gr-social-links { gap: 10px; margin-top: 22px; } .gr-social-links a { padding: 8px 11px; font-size: 9px; letter-spacing: 1.5px; } } @media (max-width: 480px) { .gr-hero-title { font-size: 20px !important; line-height: 1.18 !important; } .gr-hero-title + p { max-width: 260px !important; font-size: 13px !important; line-height: 1.65 !important; } .gr-brand-cards { max-width: 300px !important; } .gr-brand-logo { width: min(150px, 88%) !important; } .gr-section-title { font-size: 26px !important; } .gr-property-card { min-height: 360px !important; } body.wp-theme-grupo-realiza:not(.home) header > div[style*="max-width:600px"] { min-height: 92svh !important; width: 100% !important; max-width: 100vw !important; padding: 98px 26px 112px !important; box-sizing: border-box !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: flex-start !important; text-align: left !important; } body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title { font-size: 35px !important; line-height: 1.06 !important; max-width: 100% !important; margin-bottom: 22px !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } body.wp-theme-grupo-realiza:not(.home) header .gr-hero-title + p { max-width: 100% !important; font-size: 16px !important; line-height: 1.62 !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } body.home.wp-theme-grupo-realiza header .gr-hero-title + p { color: #e5edf8 !important; } } body.wp-theme-grupo-realiza .elementor-section.elementor-section-boxed > .elementor-container, body.wp-theme-grupo-realiza .elementor-section > .elementor-container, body.wp-theme-grupo-realiza .elementor-container, body.wp-theme-grupo-realiza .elementor-column, body.wp-theme-grupo-realiza .elementor-widget-wrap, body.wp-theme-grupo-realiza .elementor-widget, body.wp-theme-grupo-realiza .elementor-widget-container { width: 100% !important; max-width: none !important; } body.wp-theme-grupo-realiza .elementor-column-gap-default > .elementor-column > .elementor-element-populated, body.wp-theme-grupo-realiza .elementor-widget-wrap, body.wp-theme-grupo-realiza .elementor-widget-container { padding-left: 0 !important; padding-right: 0 !important; } body.wp-theme-grupo-realiza header { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; box-sizing: border-box !important; }