/* ESTILOS CUSTOMIZADOS - PORTAL FERNANDA IMÓVEIS & HOTSITES DE LUXO (PADRÃO LE BLU) */ /* Google Fonts moved to in HTML for performance */ /* Previne overflow horizontal global — elimina faixa escura na borda direita */ html, body { overflow-x: hidden; max-width: 100vw; background-color: #050B14; } :root { --primary: #0f172a; --secondary: #d4af37; --accent: #10b981; --bg: #f8fafc; --surface: #ffffff; /* PALETA RIVIERA LUXURY (PADRÃO LE BLU CONSCIENTE) */ --hotsite-bg-dark: #050B14; --hotsite-bg-dark-2: #081322; --hotsite-bg-card: rgba(11, 23, 39, 0.85); --hotsite-gold: #C29B38; --hotsite-gold-light: #E5C06E; --hotsite-gold-border: rgba(194, 155, 56, 0.35); --hotsite-text-light: #F8FAFC; --hotsite-text-muted: #94A3B8; } body { font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; background-color: var(--bg); color: #1e293b; overflow-x: hidden; } .font-serif-luxury { font-family: 'Playfair Display', serif; } .font-price { font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-feature-settings: 'tnum' on, 'lnum' on; letter-spacing: -0.025em; } /* Custom Scrollbar */ ::-webkit-scrollbar { width: 8px; height: 8px; } ::-webkit-scrollbar-track { background: #0f172a; } ::-webkit-scrollbar-thumb { background: #334155; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #C29B38; } /* Card Hover Effects na Vitrine */ .property-card { transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1); } .property-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px -6px rgba(15, 23, 42, 0.12), 0 8px 10px -6px rgba(15, 23, 42, 0.04); } /* Image Zoom */ .img-zoom-container { overflow: hidden; } .img-zoom-container img { transition: transform 0.4s ease; } .property-card:hover .img-zoom-container img { transform: scale(1.05); } /* Shimmer Loading Placeholder */ .shimmer { background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; } @keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* Modal Transitions */ .modal-backdrop { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); } /* Category Pills Horizontal Scrollbar Hide */ .no-scrollbar::-webkit-scrollbar { display: none; } .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } /* ========================================================================== ESTILOS DEDICADOS AO MODO HOTSITE (PADRÃO LE BLU CONSCIENTE) ========================================================================== */ .hotsite-wrapper { background-color: var(--hotsite-bg-dark); background-image: radial-gradient(circle at 15% 10%, rgba(2, 132, 199, 0.15) 0%, transparent 45%), radial-gradient(circle at 85% 15%, rgba(194, 155, 56, 0.12) 0%, transparent 48%), radial-gradient(circle at 50% 50%, rgba(14, 165, 233, 0.06) 0%, transparent 60%), linear-gradient(180deg, #050B14 0%, #081322 35%, #060F1A 70%, #03070D 100%); color: var(--hotsite-text-light); min-height: 100vh; position: relative; } /* Micro-textura arquitetônica de pontos Le Blu */ .hotsite-wrapper::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, 0.08) 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; z-index: 0; } .hotsite-wrapper > * { position: relative; z-index: 1; } /* Alinhamento de Parágrafos Hotsite Justificados (Mobile & Desktop) */ .hotsite-wrapper p.justify-lead, .text-justify-clean, .hotsite-wrapper .text-justify-clean, .hotsite-wrapper p.text-justify-clean, .hs-faq-content { text-align: justify !important; text-justify: inter-word !important; hyphens: auto !important; -webkit-hyphens: auto !important; -moz-hyphens: auto !important; -ms-hyphens: auto !important; } /* Glass Cards de Luxo */ .hotsite-glass-card { background: rgba(11, 23, 39, 0.75); border: 1px solid rgba(194, 155, 56, 0.25); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.5); } .hotsite-glass-card:hover { border-color: rgba(194, 155, 56, 0.5); box-shadow: 0 25px 50px -12px rgba(194, 155, 56, 0.15); } /* Badges Dourados de Luxo */ .badge-gold, button.badge-gold, span.badge-gold { background: rgba(194, 155, 56, 0.22) !important; color: #E5C06E !important; border: 1px solid rgba(194, 155, 56, 0.55) !important; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); } .badge-gold:hover, button.badge-gold:hover { background: #C29B38 !important; color: #050B14 !important; border-color: #E5C06E !important; } /* Botão Primário Dourado Le Blu */ .btn-gold { background: linear-gradient(135deg, #C29B38 0%, #D4AF37 50%, #9B7824 100%); color: #050B14; font-weight: 800; box-shadow: 0 10px 25px -5px rgba(194, 155, 56, 0.4); transition: all 0.3s ease; } .btn-gold:hover { transform: translateY(-2px); box-shadow: 0 15px 30px -5px rgba(194, 155, 56, 0.6); filter: brightness(1.1); } /* Tab de Plantas Ativa */ .planta-tab-active { background: linear-gradient(135deg, #C29B38 0%, #D4AF37 100%) !important; color: #050B14 !important; font-weight: 800 !important; border-color: #E5C06E !important; box-shadow: 0 4px 15px rgba(194, 155, 56, 0.4) !important; } /* Pulse Dot Animation */ .pulse-green { animation: pulseGreen 2s infinite; } @keyframes pulseGreen { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } } /* ========================================================================== CONSOLE FLUTUANTE DE BUSCA & FILTROS DE LUXO (FLOATING SEARCH CONSOLE) ========================================================================== */ .luxury-search-console { background: linear-gradient(180deg, rgba(8, 19, 34, 0.96) 0%, rgba(5, 11, 20, 0.98) 100%); border: 1px solid rgba(194, 155, 56, 0.35); box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.7), 0 0 40px -10px rgba(194, 155, 56, 0.15); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } .luxury-search-console:hover { border-color: rgba(194, 155, 56, 0.55); } /* Textura arquitetônica no Hero da Home */ .home-hero-texture { position: relative; background-color: #050B14; background-image: radial-gradient(circle at 50% 0%, rgba(194, 155, 56, 0.15) 0%, transparent 60%), radial-gradient(circle at 10% 20%, rgba(2, 132, 199, 0.12) 0%, transparent 45%), linear-gradient(180deg, #050B14 0%, #081322 50%, #050B14 100%); } .home-hero-texture::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px); background-size: 28px 28px; pointer-events: none; } /* Selects Estilizados do Console */ .luxury-select { background-color: rgba(11, 23, 39, 0.9); border: 1px solid rgba(51, 65, 85, 0.8); color: #F8FAFC; transition: all 0.25s ease; } .luxury-select:focus { border-color: #C29B38; outline: none; box-shadow: 0 0 0 2px rgba(194, 155, 56, 0.25); background-color: #050B14; } /* Tabs de Categoria no Console */ .cat-tab-active { background: linear-gradient(135deg, #C29B38 0%, #E5C06E 100%) !important; color: #050B14 !important; font-weight: 900 !important; border-color: #E5C06E !important; box-shadow: 0 4px 14px rgba(194, 155, 56, 0.4) !important; } /* Card do Empreendimento - Acabamento Refinado */ .luxury-property-card { transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1); background: #ffffff; border: 1px solid #e2e8f0; } .luxury-property-card:hover { transform: translateY(-6px); box-shadow: 0 22px 35px -10px rgba(15, 23, 42, 0.16), 0 0 0 1px rgba(194, 155, 56, 0.3); border-color: rgba(194, 155, 56, 0.4); } /* ========================================================================== ENQUADRAMENTO UNIFICADO DE TODAS AS MINIATURAS E IMAGENS DE IMÓVEIS - Recuo Máximo Sem Bordas Laterais (object-cover + aspect-[4/3]) - Zero bordas laterais (w-full h-full object-cover) - Exibição de Baixo para Cima (Prioridade para a Portaria / Térreo) - Hover Refinado (scale-1.02) ========================================================================== */ .luxury-property-card .aspect-\[4\/3\], .luxury-property-card .aspect-\[16\/10\], .property-card .aspect-\[4\/3\], .property-card .aspect-\[16\/10\], #property-grid > div > div:first-child > div:first-child { aspect-ratio: 4 / 3 !important; } .luxury-property-card img, .property-card img, #property-grid img, .card-thumb-img, #hs-main-photo, #modal-main-image { width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center bottom !important; } .luxury-property-card:hover img, .property-card:hover img { transform: scale(1.02) !important; } /* ========================================================================== ÁREA DE RESULTADOS DAS BUSCAS & CATÁLOGO (CLAREADA EM 30%) Mantém os imóveis 100% como estão, elevando a luminosidade da vitrine ========================================================================== */ #catalog-results-main { background: radial-gradient(circle at 50% 10%, rgba(25, 52, 85, 0.45) 0%, rgba(12, 26, 44, 0.3) 65%, transparent 100%); border-radius: 2rem; padding: 1.5rem 1rem 4rem 1rem; margin-top: 1rem; } #catalog-section-title { color: #ffffff !important; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); } #catalog-section-subtitle { color: #cbd5e1 !important; }