/* * styles.css — mapa do ficheiro (pesquisar pela etiqueta entre colchetes) * --------------------------------------------------------------------------- * [BASE] Reset, :root (paleta FT + --ft-accent-*), body, partículas, overrides .text-* * [NAV] Navbar * [MOB] Ajustes telemóvel * [LAY] Containers e secções globais * [CARDS] Cartões * [BTNS] Botões * [CONT] Secção contacto * [FOOT] Rodapé * [AUTH] Login / registo * [CONTA] Minha conta (conta.php) * [SEC] Secções específicas (about, features, galerias, …) * [LIGHT] Lightbox galeria * [WA] WhatsApp flutuante * [CHAT] Assistente / dúvidas * [FX] Animações scroll + validação formulários * [FORM] Formulários em cards (contacto) * [LAZY] Lazy loading imagens * [FUNC] Página Funcionários (títulos, foto equipa) * [HOME] Hero (regras agrupadas), produtos, testemunhos, galeria, @keyframes, @media 768px * [THEME] Páginas internas (.page-main) + página inicial (data-page=home) * --------------------------------------------------------------------------- * Fontes: carregadas no de cada página (evita @import bloqueante aqui). */ /* ===== RESET E BASE ===== */ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { overflow-x: hidden; background: #0f182c; } /* Paleta de fundo alinhada à página inicial (reutilizada em todo o site) */ :root { --ft-page-bg: linear-gradient(155deg, #141022 0%, #1a1230 36%, #0f182c 100%); --ft-page-1: #141022; --ft-page-2: #1a1230; --ft-page-3: #0f182c; --ft-surface: linear-gradient(165deg, rgba(30, 16, 52, 0.94) 0%, rgba(20, 10, 40, 0.96) 45%, rgba(12, 6, 24, 0.98) 100%); --ft-surface-soft: linear-gradient(165deg, rgba(28, 16, 48, 0.88) 0%, rgba(18, 10, 36, 0.93) 55%, rgba(10, 5, 20, 0.96) 100%); --ft-card: linear-gradient(165deg, rgba(38, 22, 62, 0.94) 0%, rgba(24, 14, 46, 0.96) 100%); --ft-navbar: linear-gradient(135deg, rgba(26, 14, 44, 0.97) 0%, rgba(18, 10, 34, 0.98) 100%); --ft-navbar-hover: linear-gradient(135deg, rgba(34, 18, 54, 0.98) 0%, rgba(24, 14, 42, 0.99) 100%); --ft-chat-panel: linear-gradient(180deg, rgba(22, 12, 38, 0.98) 0%, rgba(12, 6, 22, 0.99) 100%); --ft-footer: linear-gradient(180deg, #0a0614 0%, #050308 100%); /* Laranja — títulos em gradiente (evita repetir a mesma declaração) */ --ft-accent-gradient: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ffa500 100%); --ft-accent-gradient-btn: linear-gradient(135deg, #ff8c00, #ff6600); } body { font-family: 'Poppins', sans-serif; background: var(--ft-page-bg); /* scroll (não fixed): fixed força repaint de ecrã inteiro ao scroll — muito pesado */ color: #e5e5e5; min-height: 100vh; overflow-x: hidden; position: relative; } /* Forçar todo o texto preto/cinzento para branco em todo o site */ .text-muted, .text-dark, .text-body, .lead, p.lead, .list-group-item, .list-group-item-text, small, small.text-muted, .card-body p, .list-unstyled, .dropdown-menu, .dropdown-item, .modal-body, .modal-content, .table, .table td, .table th, label, .form-text, .bg-dark, .bg-dark p, .bg-dark .card-text, .bg-dark .lead { color: #e5e5e5 !important; } a.text-muted:hover, a.text-dark:hover { color: #fff !important; } /* Efeito de partículas no fundo */ body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle at 22% 48%, rgba(255, 140, 0, 0.09) 0%, transparent 46%), radial-gradient(circle at 78% 74%, rgba(120, 60, 200, 0.08) 0%, transparent 44%), radial-gradient(circle at 46% 14%, rgba(255, 120, 50, 0.07) 0%, transparent 42%); pointer-events: none; z-index: 0; } /* ===== NAVBAR ===== */ .navbar-custom { background: var(--ft-navbar); backdrop-filter: blur(12px) saturate(150%); border-bottom: 2px solid rgba(255, 140, 0, 0.3); box-shadow: 0 8px 32px rgba(255, 140, 0, 0.4); position: sticky; top: 0; z-index: 1000; padding: 1.2rem 2rem; transition: background 0.25s ease, box-shadow 0.25s ease; } @media (hover: hover) and (pointer: fine) { .navbar-custom:hover { background: var(--ft-navbar-hover); box-shadow: 0 12px 48px rgba(255, 140, 0, 0.6); } } /* Ícone do menu (hambúrguer) em laranja */ .navbar-custom .navbar-toggler { border: 1px solid rgba(255, 140, 0, 0.55); box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); } .navbar-custom .navbar-toggler:focus { box-shadow: 0 0 0 0.2rem rgba(255, 140, 0, 0.25); } .navbar-custom .navbar-toggler-icon { /* SVG embutido com traços laranja */ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,140,0,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); } .navbar-custom .navbar-brand { transition: transform 0.3s ease; } .navbar-custom .navbar-brand:hover { transform: translateY(-2px); } .navbar-custom .navbar-brand img.logo { max-height: 60px; filter: drop-shadow(0 0 8px rgba(255, 140, 0, 0.55)); transition: filter 0.25s ease, transform 0.25s ease; } @media (hover: hover) and (pointer: fine) { .navbar-custom .navbar-brand img.logo:hover { filter: drop-shadow(0 0 14px rgba(255, 140, 0, 0.85)); transform: scale(1.06); } } .navbar-custom .nav-link { color: #ff8c00 !important; font-weight: 600; font-size: 0.95rem; margin: 0 0.3rem; padding: 0.7rem 1rem; border-radius: 10px; position: relative; transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; text-transform: uppercase; letter-spacing: 0.8px; display: flex; align-items: center; gap: 0.5rem; } .navbar-custom .nav-link i { font-size: 0.9rem; opacity: 0.8; transition: opacity 0.2s ease, transform 0.2s ease; } .navbar-custom .nav-link:hover i { opacity: 1; transform: scale(1.2); } .navbar-custom .nav-link::before { content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 3px; background: linear-gradient(90deg, #ff8c00, #ff6600); transform: translateX(-50%); transition: width 0.3s ease; border-radius: 2px; } .navbar-custom .nav-link:hover::before, .navbar-custom .nav-link.active::before { width: 70%; } .navbar-custom .nav-link:hover, .navbar-custom .nav-link:focus { color: #ffa500 !important; background: rgba(255, 140, 0, 0.2); text-shadow: 0 0 15px rgba(255, 140, 0, 0.8); transform: translateY(-2px); box-shadow: 0 4px 15px rgba(255, 140, 0, 0.3); } .navbar-custom .nav-link.active { color: #ffa500 !important; background: rgba(255, 140, 0, 0.25); text-shadow: 0 0 10px rgba(255, 140, 0, 0.6); } /* Separador visual na navbar */ .navbar-custom .nav-separator { width: 1px; height: 30px; background: rgba(255, 140, 0, 0.3); margin: 0 0.5rem; align-self: center; } /* Grupo de autenticação (Login/Registo) */ .navbar-custom .nav-auth-group { display: flex; align-items: center; gap: 0.5rem; margin-left: 1rem; padding-left: 1rem; border-left: 1px solid rgba(255, 140, 0, 0.3); } .navbar-custom .nav-auth-group .nav-link { padding: 0.6rem 1.2rem; font-size: 0.9rem; background: rgba(255, 140, 0, 0.1); border: 1px solid rgba(255, 140, 0, 0.3); } .navbar-custom .nav-auth-group .nav-link:hover { background: rgba(255, 140, 0, 0.25); border-color: rgba(255, 140, 0, 0.5); } /* Estado “conta ligada” (preenchido por nav-session.js) */ .navbar-custom .nav-auth-group .nav-auth-status { display: flex; cursor: default; pointer-events: none; flex-direction: column; align-items: flex-start; justify-content: center; gap: 0.15rem; line-height: 1.2; } .navbar-custom .nav-auth-group .nav-auth-status.nav-auth-status--with-photo { flex-direction: row; align-items: center; gap: 0.65rem; max-width: 100%; } .navbar-custom .nav-auth-group .nav-auth-avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 2px solid rgba(255, 140, 0, 0.55); box-shadow: 0 0 12px rgba(255, 140, 0, 0.35); } .navbar-custom .nav-auth-group .nav-auth-status-text { display: flex; flex-direction: column; align-items: flex-start; gap: 0.1rem; min-width: 0; } .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line1 { display: flex; align-items: center; gap: 0.4rem; font-weight: 600; color: #ffe0c2; } .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line1 .fa-circle-check { color: #ff8c00; } .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line2 { display: block; font-size: 0.8rem; font-weight: 400; color: rgba(255, 255, 255, 0.85); max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line3 { display: block; font-size: 0.75rem; font-weight: 500; color: rgba(255, 200, 150, 0.95); max-width: 11rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* Responsividade melhorada */ @media (max-width: 991px) { .navbar-custom .nav-link { margin: 0.3rem 0; padding: 0.8rem 1.2rem; width: 100%; justify-content: flex-start; } .navbar-custom .nav-separator { display: none; } .navbar-custom .nav-auth-group { margin-left: 0; padding-left: 0; border-left: none; border-top: 1px solid rgba(255, 140, 0, 0.3); padding-top: 1rem; margin-top: 0.5rem; width: 100%; flex-direction: column; } .navbar-custom .nav-auth-group .nav-link { width: 100%; } .navbar-custom .nav-auth-group .nav-auth-status { width: 100%; } .navbar-custom .nav-auth-group .nav-auth-status.nav-auth-status--with-photo { flex-direction: row; align-items: center; } .navbar-custom .nav-auth-group .nav-auth-status-text { max-width: calc(100% - 52px); } .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line2, .navbar-custom .nav-auth-group .nav-auth-status .nav-auth-line3 { max-width: 100%; } } /* ===== MOBILE: ajustes gerais para telemóvel ===== */ @media (max-width: 768px) { .navbar-custom { padding: 0.75rem 1rem; } section { padding: 1.75rem 1rem; margin: 1.5rem 0.75rem; border-radius: 16px; } section:hover { transform: none; } section h2 { font-size: 1.85rem; margin-bottom: 1.25rem; padding-bottom: 0.75rem; } section p { font-size: 1rem; line-height: 1.7; margin-bottom: 1rem; } .container { padding-left: 1rem; padding-right: 1rem; max-width: 100%; } .card-img-top { height: 200px; } .card-body { padding: 1.25rem; } .btn-warning { padding: 0.75rem 1.5rem; font-size: 0.9rem; } /* Performance: backdrop-filter custa muito GPU em ecrãs pequenos */ .navbar-custom, section, .card, footer { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } @media (max-width: 480px) { section { padding: 1.25rem 0.75rem; margin: 1rem 0.5rem; } section h2 { font-size: 1.5rem; } .container { padding-left: 0.75rem; padding-right: 0.75rem; } .hero-buttons { flex-direction: column; gap: 0.75rem; } .hero-btn { width: 100%; justify-content: center; min-height: 48px; } } /* ===== CONTAINER E SEÇÕES ===== */ .container { position: relative; z-index: 1; } section { background: var(--ft-surface); backdrop-filter: blur(10px) saturate(140%); padding: 3.5rem 2.5rem; border-radius: 24px; margin: 3rem auto; max-width: 1200px; box-shadow: 0 20px 60px rgba(255, 140, 0, 0.3), 0 0 0 1px rgba(255, 140, 0, 0.2), inset 0 0 40px rgba(255, 140, 0, 0.05); border: 1px solid rgba(255, 140, 0, 0.3); transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease; position: relative; overflow: hidden; } section::before { content: ''; position: absolute; top: -50%; right: -50%; width: 200%; height: 200%; background: radial-gradient(circle, rgba(255, 140, 0, 0.1) 0%, transparent 70%); opacity: 0; transition: opacity 0.35s ease; } @media (hover: hover) and (pointer: fine) { section:hover::before { opacity: 1; } section:hover { transform: translateY(-8px); box-shadow: 0 30px 80px rgba(255, 140, 0, 0.5), 0 0 0 1px rgba(255, 140, 0, 0.4), inset 0 0 60px rgba(255, 140, 0, 0.1); border-color: rgba(255, 140, 0, 0.5); } } section h2 { font-size: 3.2rem; font-weight: 800; margin-bottom: 2rem; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; letter-spacing: 1.5px; text-align: center; position: relative; padding-bottom: 1rem; } section h2::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 100px; height: 4px; background: linear-gradient(90deg, #ff8c00, #ff6600, #ffa500); border-radius: 2px; box-shadow: 0 0 20px rgba(255, 140, 0, 0.8); } section p { font-size: 1.2rem; line-height: 1.9; color: #d1d5db; margin-bottom: 1.5rem; text-align: center; } .card .card-body p, .card .card-text { text-align: start; } .card .card-body.text-center p, .card .card-body.text-center .card-text { text-align: center; } /* ===== CARDS ===== */ .card { background: var(--ft-card); backdrop-filter: blur(8px) saturate(130%); border: 2px solid rgba(255, 140, 0, 0.3); border-radius: 20px; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; box-shadow: 0 10px 30px rgba(255, 140, 0, 0.3); position: relative; } .card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 6px; background: linear-gradient(90deg, #ff8c00, #ff6600, #ffa500); opacity: 0; transition: opacity 0.25s ease; } @media (hover: hover) and (pointer: fine) { .card:hover::before { opacity: 1; } .card:hover { transform: translateY(-12px) scale(1.02); border-color: rgba(255, 140, 0, 0.6); box-shadow: 0 25px 50px rgba(255, 140, 0, 0.5), 0 0 60px rgba(255, 140, 0, 0.3); } .card:hover .card-img-top { transform: scale(1.1); } } .card-img-top { height: 250px; object-fit: cover; transition: transform 0.35s ease; } .card-body { padding: 1.8rem; background: rgba(20, 10, 40, 0.5); } .card-title { font-size: 1.6rem; font-weight: 700; color: #ff8c00 !important; margin-bottom: 0.8rem; text-shadow: 0 0 10px rgba(255, 140, 0, 0.5); } .card-text { color: #ccc4e0; font-size: 1.05rem; line-height: 1.6; } .card-subtitle { color: #ff8c00 !important; font-weight: 700; } .contact-social-link { display: inline-flex; align-items: center; gap: 0.5rem; color: #ff8c00; text-decoration: none; font-weight: 600; font-size: 0.95rem; transition: color 0.2s ease; } .contact-social-link:hover { color: #ffa500; } /* Texto mais vivo na secção de funcionários */ .team-card .card-title { color: #ff8c00 !important; /* laranja vivo */ } .team-card .text-muted { color: #ff8c00 !important; /* função do funcionário */ } .team-card .card-text { color: #e5e5ff !important; /* descrição em lilás claro */ } /* Sem foto individual disponível — iniciais (evita usar retratos incorretos) */ .team-photo-placeholder { width: 100%; aspect-ratio: 4 / 3; min-height: 200px; background: linear-gradient( 145deg, rgba(255, 140, 0, 0.18) 0%, rgba(26, 14, 44, 0.92) 45%, rgba(12, 6, 22, 0.98) 100% ); display: flex; align-items: center; justify-content: center; font-size: clamp(2rem, 6vw, 3rem); font-weight: 800; letter-spacing: 0.08em; color: #ffb347; text-shadow: 0 2px 18px rgba(255, 140, 0, 0.35); border-bottom: 1px solid rgba(255, 140, 0, 0.22); } /* ===== BOTÕES ===== */ .btn-warning { background: linear-gradient(135deg, #ff8c00 0%, #ff6400 100%); border: none; color: white; font-weight: 700; padding: 0.9rem 2rem; border-radius: 12px; transition: all 0.3s ease; text-transform: uppercase; letter-spacing: 1px; box-shadow: 0 6px 20px rgba(255, 140, 0, 0.4); position: relative; overflow: hidden; } .btn-warning::before { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.3); transform: translate(-50%, -50%); transition: width 0.6s, height 0.6s; } .btn-warning:hover::before { width: 300px; height: 300px; } .btn-warning:hover { transform: translateY(-3px); box-shadow: 0 12px 35px rgba(255, 140, 0, 0.6); background: linear-gradient(135deg, #ff6600 0%, #ff4500 100%); } /* ===== SEÇÃO DE CONTATO ===== */ #Contacto p, #Contacto a { font-size: 1.3rem; margin: 1rem auto; max-width: 500px; text-align: center; color: #ff8c00 !important; } #Contacto a { color: #ff8c00 !important; text-decoration: none; font-weight: 700; transition: color 0.2s ease, background 0.2s ease, transform 0.2s ease; padding: 0.3rem 0.8rem; border-radius: 8px; display: inline-block; } #Contacto a:hover { color: #fff !important; background: var(--ft-accent-gradient-btn); text-shadow: 0 0 15px rgba(255, 140, 0, 0.8); transform: scale(1.05); } /* ===== FOOTER ===== */ footer { background: linear-gradient(135deg, #1e1435 0%, #3d2667 100%); backdrop-filter: blur(10px) saturate(130%); color: #d1d5db; padding: 3rem 1.5rem; text-align: center; font-weight: 500; letter-spacing: 0.5px; border-top: 2px solid rgba(255, 140, 0, 0.3); box-shadow: 0 -10px 40px rgba(255, 140, 0, 0.3); margin-top: 4rem; position: relative; } footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #ff8c00, #ff6600, #ffa500, #ff8c00); background-size: 200% 100%; animation: gradientShift 3s ease infinite; } @keyframes gradientShift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } } footer p { margin: 0.8rem 0; font-size: 1.05rem; } footer a { color: #ff8c00; text-decoration: none; font-weight: 600; transition: color 0.2s ease, background 0.2s ease, text-shadow 0.2s ease; padding: 0.2rem 0.5rem; border-radius: 6px; } footer a:hover { color: #fff; background: var(--ft-accent-gradient-btn); text-shadow: 0 0 15px rgba(255, 140, 0, 0.8); } footer.bg-dark.low-bottom, footer.footer-section { background: var(--ft-footer) !important; border-top: 1px solid rgba(255, 160, 60, 0.22); } /* ===== FOOTER REDESENHADO [FOOT-NEW] ===== */ footer.site-footer { background: #0d0d10 !important; padding: 0 !important; text-align: left !important; } .footer-main { padding: 4rem 0 3rem; } /* Logo pequeno no footer — precisa de !important porque o Bootstrap carrega depois */ footer.site-footer .footer-logo { display: block !important; max-height: 100px !important; width: auto !important; max-width: 160px !important; filter: drop-shadow(0 0 6px rgba(255, 140, 0, 0.4)); } .footer-tagline { font-size: 0.875rem !important; line-height: 1.65; color: #8a8a9a; margin-top: 0.75rem; margin-bottom: 0 !important; } .footer-social { display: flex !important; gap: 0.6rem; margin-top: 0.75rem; } .footer-social a { display: flex !important; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 140, 0, 0.1); border: 1px solid rgba(255, 140, 0, 0.28); color: #ff8c00 !important; font-size: 1rem; transition: background 0.2s, color 0.2s, transform 0.2s; text-decoration: none; } .footer-social a:hover { background: var(--ft-accent-gradient-btn); color: #fff !important; transform: translateY(-3px); text-shadow: none; } .footer-heading { color: #ff8c00; font-size: 0.88rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1.2px; margin-bottom: 1.1rem; position: relative; padding-bottom: 0.55rem; } .footer-heading::after { content: ''; position: absolute; bottom: 0; left: 0; width: 28px; height: 2px; background: var(--ft-accent-gradient-btn); border-radius: 2px; } /* Listas do footer — reset de bullets e padding do browser/Bootstrap */ footer.site-footer .footer-links, footer.site-footer .footer-hours, footer.site-footer .footer-contact { list-style: none !important; padding-left: 0 !important; margin: 0 !important; } footer.site-footer .footer-links li { margin-bottom: 0.45rem; } footer.site-footer .footer-links a { color: #9a9aaa !important; text-decoration: none !important; font-size: 0.875rem; display: flex !important; align-items: center; gap: 0.45rem; transition: color 0.2s, padding-left 0.2s; padding: 0.12rem 0 !important; background: none !important; } footer.site-footer .footer-links a i { font-size: 0.55rem; color: #ff8c00; transition: transform 0.2s; flex-shrink: 0; } footer.site-footer .footer-links a:hover { color: #ff8c00 !important; padding-left: 5px !important; text-shadow: none; } footer.site-footer .footer-links a:hover i { transform: translateX(3px); } footer.site-footer .footer-hours li { display: flex !important; justify-content: space-between !important; align-items: center; padding: 0.38rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.055); font-size: 0.86rem; color: #9a9aaa; } footer.site-footer .footer-hours li:last-child { border-bottom: none; } .footer-hours__time { color: #d8d8e8; font-weight: 600; font-size: 0.82rem; white-space: nowrap; margin-left: 0.5rem; } .footer-hours--closed .footer-hours__time { color: #5a5a6a; } .footer-hours--closed span:first-child { color: #6a6a7a; } footer.site-footer .footer-contact li { display: flex !important; align-items: flex-start; gap: 0.7rem; margin-bottom: 0.85rem; font-size: 0.875rem; color: #9a9aaa; } footer.site-footer .footer-contact li i { color: #ff8c00; font-size: 0.88rem; margin-top: 0.18rem; flex-shrink: 0; width: 14px; text-align: center; } footer.site-footer .footer-contact a { color: #9a9aaa !important; text-decoration: none !important; transition: color 0.2s; background: none !important; padding: 0 !important; } footer.site-footer .footer-contact a:hover { color: #ff8c00 !important; text-shadow: none; } /* Localização e contacto — novo estilo Global Tendas */ .footer-location-block { display: flex; align-items: flex-start; gap: 0.85rem; margin-bottom: 1.5rem; } .footer-location-pin { font-size: 1.7rem; color: #ff8c00; margin-top: 0.1rem; flex-shrink: 0; } .footer-location-city { display: block; font-size: 1rem; font-weight: 800; color: #ff8c00; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 0.25rem; } .footer-location-addr { font-size: 0.875rem; color: #8a8a9a; line-height: 1.6; margin: 0; } .footer-contact-list { display: flex; flex-direction: column; gap: 0.65rem; } .footer-contact-item { display: flex !important; align-items: center; gap: 0.65rem; color: #9a9aaa !important; text-decoration: none !important; font-size: 0.9rem; transition: color 0.2s; background: none !important; padding: 0 !important; } .footer-contact-item i { color: #ff8c00; width: 14px; text-align: center; font-size: 0.85rem; flex-shrink: 0; } .footer-contact-item:hover { color: #ff8c00 !important; text-shadow: none; } .footer-col--brand { display: flex; flex-direction: column; } .footer-bottom { background: #060608; border-top: 1px solid rgba(255, 140, 0, 0.12); padding: 1.1rem 0; } .footer-bottom p { margin: 0 !important; font-size: 0.8rem !important; color: #5a5a6a; font-weight: 400; letter-spacing: 0; } .footer-bottom__row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; } .footer-bottom__legal { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; } .footer-bottom__link { color: #5a5a6a; text-decoration: none; font-size: 0.8rem; transition: color 0.2s; } .footer-bottom__link:hover { color: #ff8c00; } .footer-bottom__link--rec { color: #c0392b; } .footer-bottom__link--rec:hover { color: #e74c3c; } .footer-bottom__sep { color: #3a3a4a; font-size: 0.8rem; } .footer-badge { display: inline-flex; align-items: center; gap: 0.5rem; text-decoration: none; transition: opacity 0.2s ease, transform 0.2s ease; font-family: inherit; line-height: 1.2; } .footer-badge:hover { opacity: 0.88; transform: translateY(-2px); text-decoration: none; } .footer-badge__img { display: block; height: 40px; width: auto; object-fit: contain; } .footer-badge--privacy .footer-badge__img { height: 38px; filter: drop-shadow(0 2px 6px rgba(26, 107, 191, 0.4)); } .footer-badge--lre .footer-badge__img { height: 40px; border-radius: 4px; filter: drop-shadow(0 2px 6px rgba(192, 57, 43, 0.4)); } .footer-links-with-badges { display: flex; align-items: flex-start; gap: 0.75rem; } .footer-legal-badges { display: flex; flex-direction: column; gap: 0.55rem; flex-shrink: 0; } .footer-flags { display: flex; align-items: center; justify-content: center; gap: 0.85rem; padding: 1.1rem 0 1.5rem; border-top: 1px solid rgba(255, 140, 0, 0.08); margin-top: 0.5rem; } .footer-bottom__row { justify-content: center; } .footer-flag { height: 52px; width: auto; border-radius: 4px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5); transition: transform 0.2s ease, opacity 0.2s ease; } .footer-flag:hover { transform: scale(1.1); opacity: 0.9; } .footer-flag--fafe { height: 90px; width: 60px; border-radius: 5px; } /* ===== COOKIE BANNER ===== */ #cookie-banner { position: fixed; bottom: 0; left: 0; right: 0; background: rgba(14, 14, 20, 0.97); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid rgba(255, 140, 0, 0.25); padding: 0.9rem 1.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; z-index: 9999; flex-wrap: wrap; transition: transform 0.4s ease, opacity 0.4s ease; } #cookie-banner p { margin: 0 !important; font-size: 0.85rem !important; color: #aaa !important; font-weight: 400 !important; } .cookie-banner__link { color: #ff8c00; text-decoration: underline; transition: color 0.2s; } .cookie-banner__link:hover { color: #ffaa33; } .cookie-banner__btn { background: linear-gradient(135deg, #ff8c00, #e05c00); color: #fff; border: none; border-radius: 8px; padding: 0.45rem 1.4rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: opacity 0.2s; font-family: inherit; } .cookie-banner__btn:hover { opacity: 0.85; } .cookie-banner--hidden { transform: translateY(100%); opacity: 0; } section.bg-gradient { background: var(--ft-surface) !important; } /* ===== AVALIAÇÕES REDESENHADAS [REVIEWS-NEW] ===== */ .reviews-section { padding: 5rem 0 4rem; position: relative; z-index: 1; } .reviews-eyebrow { color: #4285F4; font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 0.5rem; } .reviews-summary { display: flex; align-items: center; justify-content: center; gap: 1.5rem; background: var(--ft-card); border: 1px solid rgba(255, 193, 7, 0.18); border-radius: 20px; padding: 1.6rem 2.2rem; max-width: 380px; backdrop-filter: blur(12px); box-shadow: 0 8px 32px rgba(255, 193, 7, 0.07); } .reviews-summary__score { font-size: 3.8rem; font-weight: 800; color: #fff; line-height: 1; letter-spacing: -2px; } .reviews-summary__right { display: flex; flex-direction: column; gap: 0.25rem; } .reviews-summary__stars { color: #ffc107; font-size: 1rem; letter-spacing: 2px; } .reviews-summary__label { font-size: 0.78rem; color: #888; margin: 0; } .reviews-summary__link { font-size: 0.8rem; color: #4285F4; text-decoration: none; font-weight: 600; transition: color 0.2s; } .reviews-summary__link:hover { color: #6aa3f8; text-decoration: underline; } /* Cartões de avaliação */ .review-card { background: var(--ft-card); border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 18px; padding: 1.5rem; display: flex; flex-direction: column; gap: 0.9rem; height: 100%; transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; backdrop-filter: blur(10px); text-decoration: none !important; color: inherit !important; position: relative; overflow: hidden; } .review-card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #ffc107, #ff8c00); opacity: 0; transition: opacity 0.25s ease; } .review-card:hover { transform: translateY(-6px); border-color: rgba(255, 193, 7, 0.3); box-shadow: 0 20px 48px rgba(255, 193, 7, 0.1); text-decoration: none !important; } .review-card:hover::after { opacity: 1; } .review-card--external { cursor: pointer; } /* Rating highlight card */ .review-card--rating { align-items: center; justify-content: center; text-align: center; gap: 0.6rem; } .review-card--rating__logo { font-size: 2.4rem; color: #4285F4; margin-bottom: 0.1rem; } .review-card--rating__score { font-size: 3.8rem; font-weight: 900; line-height: 1; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; } .review-card--rating__stars { color: #ffc107; font-size: 1rem; letter-spacing: 3px; } .review-card--rating__label { font-size: 0.8rem; color: #888; margin: 0; } /* Invite CTA card */ .review-card--invite { align-items: center; text-align: center; gap: 0.75rem; } .review-card--invite__icon { width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(135deg, #ff8c00, #ff6600); display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #fff; flex-shrink: 0; } .review-card--invite__title { font-size: 1rem; font-weight: 700; color: #e5e5e5; margin: 0; } .review-card--invite__text { font-size: 0.83rem; color: #999; line-height: 1.55; margin: 0; flex: 1; } .review-card--rating .review-card__source, .review-card--invite .review-card__source { align-self: center; text-align: center; } .review-card__header { display: flex; align-items: center; gap: 0.75rem; } .review-card__avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--ft-accent-gradient-btn); display: flex; align-items: center; justify-content: center; font-size: 0.82rem; font-weight: 700; color: #fff; flex-shrink: 0; letter-spacing: 0.5px; } .review-card__avatar--anon { background: rgba(255, 255, 255, 0.07); color: #666; border: 1px solid rgba(255, 255, 255, 0.1); } .review-card__name { font-size: 0.88rem; font-weight: 700; color: #e5e5e5; margin: 0; } .review-card__stars { color: #ffc107; font-size: 0.72rem; letter-spacing: 1.5px; margin-top: 2px; } .review-card__g { color: #4285F4; font-size: 1rem; flex-shrink: 0; opacity: 0.8; } .review-card__quote { font-size: 0.9rem; color: #c8c8c8; font-style: italic; line-height: 1.65; margin: 0; flex: 1; padding-left: 0.85rem; border-left: 3px solid rgba(255, 193, 7, 0.45); } .review-card__open { font-size: 0.85rem; color: #777; margin: 0; flex: 1; font-style: italic; line-height: 1.5; padding: 0.75rem; background: rgba(255, 255, 255, 0.03); border-radius: 8px; border: 1px dashed rgba(255, 255, 255, 0.08); text-align: center; } .review-card__source { font-size: 0.76rem; color: #4285F4 !important; font-weight: 600; text-decoration: none !important; align-self: flex-start; margin-top: auto; padding-top: 0.25rem; border-top: 1px solid rgba(255, 255, 255, 0.06); width: 100%; } /* Botão CTA avaliações */ .reviews-cta-btn { display: inline-flex; align-items: center; padding: 0.9rem 2.2rem; background: linear-gradient(135deg, #4285F4, #1a73e8); color: #fff !important; border-radius: 50px; text-decoration: none !important; font-weight: 600; font-size: 0.95rem; transition: transform 0.2s, box-shadow 0.2s; box-shadow: 0 6px 24px rgba(66, 133, 244, 0.35); letter-spacing: 0.3px; } .reviews-cta-btn:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(66, 133, 244, 0.5); } /* ===== SECÇÃO RECONHECIMENTO [RECONHEC] ===== */ .reconhec-section { padding: 5rem 0 4rem; position: relative; z-index: 1; } .reconhec-eyebrow { color: #ff8c00; font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 0.5rem; } .reconhec-card { background: var(--ft-card); border: 1px solid rgba(255, 140, 0, 0.2); border-radius: 20px; padding: 2rem 1.5rem; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.6rem; height: 100%; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; backdrop-filter: blur(10px); position: relative; overflow: hidden; } .reconhec-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--ft-accent-gradient); opacity: 0; transition: opacity 0.25s ease; } .reconhec-card--link { text-decoration: none; cursor: pointer; color: inherit; } .reconhec-card--link:hover, .reconhec-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.2); border-color: rgba(255, 140, 0, 0.5); } .reconhec-card--link:hover::before, .reconhec-card:hover::before { opacity: 1; } .reconhec-card__icon { width: 60px; height: 60px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; margin-bottom: 0.4rem; } .reconhec-card__icon--google { background: rgba(66, 133, 244, 0.15); border: 1px solid rgba(66, 133, 244, 0.3); color: #4285F4; } .reconhec-card__icon--trophy { background: rgba(255, 193, 7, 0.15); border: 1px solid rgba(255, 193, 7, 0.35); color: #ffc107; } .reconhec-card__icon--cert { background: rgba(255, 140, 0, 0.15); border: 1px solid rgba(255, 140, 0, 0.35); color: #ff8c00; } .reconhec-card__icon--fb { background: rgba(24, 119, 242, 0.15); border: 1px solid rgba(24, 119, 242, 0.3); color: #1877f2; } .reconhec-card__stars { color: #ffc107; font-size: 1.1rem; letter-spacing: 2px; margin: 0; } .reconhec-card__badge { font-size: 2.2rem; font-weight: 800; background: var(--ft-accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin: 0; line-height: 1.1; } .reconhec-card__title { font-size: 1rem; font-weight: 700; color: #e5e5e5; margin: 0; } .reconhec-card__desc { font-size: 0.82rem; color: #888; margin: 0; line-height: 1.5; } .reconhec-card__cta { font-size: 0.8rem; color: #ff8c00; font-weight: 600; margin-top: 0.3rem; } /* Diploma */ .reconhec-diploma-img { max-width: 100%; max-height: 130px; object-fit: contain; border-radius: 8px; border: 1px solid rgba(255, 140, 0, 0.25); padding: 4px; background: rgba(255, 255, 255, 0.04); } .reconhec-diploma-placeholder { width: 100%; height: 100px; border: 2px dashed rgba(255, 140, 0, 0.3); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.4rem; color: #666; font-size: 0.85rem; } .reconhec-diploma-placeholder i { font-size: 1.8rem; color: rgba(255, 140, 0, 0.4); } /* Scoring.pt badges */ .reconhec-scoring-badges { display: flex; gap: 0.75rem; justify-content: center; align-items: center; margin-bottom: 0.4rem; } .reconhec-scoring-badge { width: 90px; height: 90px; object-fit: contain; filter: drop-shadow(0 4px 12px rgba(255, 140, 0, 0.25)); transition: filter 0.25s ease, transform 0.25s ease; } .reconhec-card--scoring:hover .reconhec-scoring-badge { filter: drop-shadow(0 6px 18px rgba(255, 140, 0, 0.5)); transform: scale(1.05); } /* ===== POLÍTICA DE PRIVACIDADE ===== */ .privacy-page-title { font-size: 2.2rem; font-weight: 800; color: #ff8c00 !important; margin-bottom: 0.5rem; } .privacy-page-subtitle { color: #c8c8c8 !important; font-size: 0.9rem; } .privacy-content { max-width: 900px; margin: 0 auto; } .privacy-block { margin-bottom: 1.8rem; padding: 2rem 2.2rem; background: var(--ft-card); border: 2px solid rgba(255, 140, 0, 0.3); border-radius: 20px; backdrop-filter: blur(8px) saturate(130%); box-shadow: 0 10px 30px rgba(255, 140, 0, 0.1); position: relative; overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; } .privacy-block::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, #ff8c00, #ff6600, #ffa500); } @media (hover: hover) and (pointer: fine) { .privacy-block:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(255, 140, 0, 0.18); border-color: rgba(255, 140, 0, 0.5); } } .privacy-block h2 { font-size: 1.1rem; font-weight: 700; color: #ff8c00; margin-bottom: 1rem; padding-bottom: 0.6rem; border-bottom: 1px solid rgba(255, 140, 0, 0.15); } .privacy-block p, .privacy-block li { font-size: 0.95rem; color: #c8c8c8; line-height: 1.8; } .privacy-block ul { padding-left: 1.4rem; margin-bottom: 0; } .privacy-block a { color: #ff8c00; text-decoration: none; } .privacy-block a:hover { text-decoration: underline; } /* ===== PÁGINAS DE AUTENTICAÇÃO (LOGIN/REGISTO) ===== */ .auth-page { position: relative; z-index: 1; } .auth-card { border-radius: 24px; background: var(--ft-surface); border: 1px solid rgba(255, 140, 0, 0.25); box-shadow: 0 20px 60px rgba(255, 140, 0, 0.25), 0 0 0 1px rgba(255, 140, 0, 0.12), inset 0 0 40px rgba(255, 140, 0, 0.05); } .auth-side { background: linear-gradient(135deg, rgba(255, 140, 0, 0.22) 0%, rgba(255, 102, 0, 0.12) 100%); border-right: 1px solid rgba(255, 140, 0, 0.25); color: #fff; } .auth-side-title { font-weight: 800; letter-spacing: 0.5px; color: #fff; line-height: 1.1; } .auth-side-subtitle { font-weight: 600; color: rgba(255, 255, 255, 0.85); font-size: 0.95rem; } .auth-side-text { color: rgba(255, 255, 255, 0.85); line-height: 1.7; } .auth-side-list { list-style: none; padding-left: 0; margin: 0; display: grid; gap: 0.75rem; } .auth-side-list li { display: flex; align-items: center; gap: 0.6rem; color: rgba(255, 255, 255, 0.92); } .auth-side-list i { color: #ff8c00; text-shadow: 0 0 12px rgba(255, 140, 0, 0.7); } .auth-title { font-size: 2.2rem; font-weight: 800; margin-bottom: 0; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .auth-muted { color: rgba(229, 229, 229, 0.85); } .auth-link { color: #ff8c00; text-decoration: none; font-weight: 700; } .auth-link:hover { color: #fff; text-shadow: 0 0 15px rgba(255, 140, 0, 0.8); } /* Ajustes de input-group e formulários em fundo escuro (login e registo) */ .auth-page .form-label { color: #fff !important; } .auth-page .input-group-text { background: rgba(255, 140, 0, 0.15); border: 1px solid rgba(255, 140, 0, 0.25); color: #ff8c00; } .auth-page .form-control { background: rgba(10, 5, 25, 0.45); border: 1px solid rgba(255, 140, 0, 0.25); color: #fff !important; } .auth-page .form-control::placeholder { color: rgba(255, 255, 255, 0.55); } .auth-page .form-control:focus, .auth-page .form-control:focus-visible, .auth-page .input-group .form-control:focus { background-color: rgba(10, 5, 25, 0.92) !important; color: #fff !important; box-shadow: 0 0 0 0.25rem rgba(255, 140, 0, 0.2); border-color: rgba(255, 140, 0, 0.55); } /* Chrome autofill: evita fundo claro com texto invisível */ .auth-page input.form-control:-webkit-autofill, .auth-page input.form-control:-webkit-autofill:hover, .auth-page input.form-control:-webkit-autofill:focus, .auth-page textarea.form-control:-webkit-autofill, .auth-page textarea.form-control:-webkit-autofill:focus { -webkit-text-fill-color: #fff !important; caret-color: #fff; box-shadow: 0 0 0 1000px rgba(10, 5, 25, 0.95) inset !important; border: 1px solid rgba(255, 140, 0, 0.45); transition: background-color 99999s ease-out 0s; } .auth-page .btn-outline-light { border-color: rgba(255, 255, 255, 0.25); } .auth-page .btn-outline-light:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.35); } /* ===== MINHA CONTA (php/conta.php) ===== */ .conta-body { position: relative; z-index: 1; } .conta-layout .auth-title.h3 { font-size: clamp(1.5rem, 4vw, 2rem); } .conta-layout .conta-profile { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.2rem; border-radius: 18px; background: linear-gradient(135deg, rgba(255, 140, 0, 0.12) 0%, rgba(38, 22, 62, 0.45) 100%); border: 1px solid rgba(255, 140, 0, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06); } .conta-profile-avatar { flex-shrink: 0; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, rgba(255, 140, 0, 0.35), rgba(255, 102, 0, 0.2)); border: 2px solid rgba(255, 140, 0, 0.45); color: #fff; font-size: 1.35rem; overflow: hidden; } .conta-profile-avatar--photo { padding: 0; background: rgba(0, 0, 0, 0.25); } .conta-profile-avatar--photo img { width: 100%; height: 100%; object-fit: cover; display: block; } .conta-foto-preview-wrap { max-width: 160px; } .conta-foto-preview-img { width: 120px; height: 120px; border-radius: 16px; object-fit: cover; border: 2px solid rgba(255, 140, 0, 0.4); display: block; background: rgba(0, 0, 0, 0.2); } .conta-profile-name { font-weight: 700; font-size: 1.1rem; color: #fff; letter-spacing: 0.02em; } .conta-profile-email { font-size: 0.85rem; color: rgba(255, 255, 255, 0.75) !important; max-width: 100%; } .conta-profile-badges { display: flex; flex-wrap: wrap; gap: 0.4rem; } .conta-badge { display: inline-flex; align-items: center; font-size: 0.72rem; font-weight: 700; padding: 0.25rem 0.55rem; border-radius: 999px; letter-spacing: 0.03em; } .conta-badge-user { background: rgba(255, 193, 7, 0.95); color: #1a1020 !important; } .conta-badge-muted { background: rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.85) !important; border: 1px solid rgba(255, 255, 255, 0.2); } .conta-badge-admin { background: rgba(33, 37, 41, 0.85); color: #ffc107 !important; border: 1px solid rgba(255, 193, 7, 0.45); } .conta-section-title { font-size: 0.95rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; color: #ff8c00; margin-bottom: 1rem; padding-bottom: 0.35rem; border-bottom: 1px solid rgba(255, 140, 0, 0.35); } .conta-password-panel { border-radius: 16px; background: rgba(5, 3, 18, 0.45); border: 1px solid rgba(255, 140, 0, 0.2); box-shadow: inset 0 0 24px rgba(0, 0, 0, 0.2); } .conta-layout .conta-alert { border-radius: 14px; } .conta-layout .conta-alert.alert-success { background: rgba(25, 135, 84, 0.35) !important; color: #cff4dc !important; border: 1px solid rgba(72, 180, 120, 0.5) !important; } .conta-layout .conta-alert.alert-danger { background: rgba(180, 40, 50, 0.35) !important; color: #ffd6da !important; border: 1px solid rgba(255, 120, 130, 0.45) !important; } .conta-layout .form-text { color: rgba(255, 255, 255, 0.65) !important; } .social-icons { margin-top: 2rem; display: flex; justify-content: center; gap: 1.5rem; flex-wrap: wrap; } .social-icons a { display: inline-flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(135deg, rgba(255, 140, 0, 0.3), rgba(255, 102, 0, 0.3)); backdrop-filter: blur(20px); } /* ===== SEÇÕES ESPECÍFICAS ===== */ /* Sub-blocos (ordem no ficheiro): About / Features · Galerias · Produtos · FAQ · Sobre · Team · Estatísticas · (várias páginas) — pesquisar classe ou id. */ /* About Preview */ .about-preview { padding: 4rem 2rem; } .about-features { display: flex; flex-direction: column; gap: 1rem; margin: 2rem 0; } .feature-btn { display: flex; align-items: flex-start; gap: 0.85rem; width: 100%; padding: 1.1rem 1.2rem; background: linear-gradient(135deg, rgba(255, 140, 0, 0.1), rgba(255, 102, 0, 0.05)); border: 2px solid rgba(255, 140, 0, 0.3); border-radius: 12px; color: #e5e5e5; cursor: pointer; transition: all 0.3s ease; font-family: 'Poppins', sans-serif; font-size: 1rem; text-align: start; } .feature-btn:hover { background: linear-gradient(135deg, rgba(255, 140, 0, 0.2), rgba(255, 102, 0, 0.1)); border-color: rgba(255, 140, 0, 0.6); transform: translateX(10px); box-shadow: 0 8px 25px rgba(255, 140, 0, 0.2); } .feature-btn.active { background: linear-gradient(135deg, rgba(255, 140, 0, 0.3), rgba(255, 102, 0, 0.2)); border-color: #ff8c00; box-shadow: 0 8px 30px rgba(255, 140, 0, 0.4), inset 0 0 15px rgba(255, 140, 0, 0.1); } .feature-btn:focus-visible { outline: 2px solid rgba(255, 179, 71, 0.95); outline-offset: 3px; } .feature-btn p { margin: 0; flex: 1; min-width: 0; color: #e8eaed; text-align: start; line-height: 1.5; font-size: 0.98rem; } .feature-btn .feature-icon { flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 1.65rem; height: 1.65rem; margin-top: 0.12em; border-radius: 50%; font-size: 0.85rem; font-weight: 700; color: #1a0b12; background: linear-gradient(145deg, #ffb347, #ff8c00); box-shadow: 0 2px 10px rgba(255, 140, 0, 0.35); } .feature-btn strong { color: #ff8c00; } /* Caixa Interativa Saiba Mais */ .saiba-mais-container { margin-top: 2.5rem; display: flex; justify-content: flex-start; } .saiba-mais-btn { position: relative; display: inline-flex; align-items: center; gap: 1rem; padding: 1.5rem 3rem; background: linear-gradient(135deg, #ff8c00 0%, #ff6400 100%); color: white; text-decoration: none; border-radius: 50px; font-weight: 700; font-size: 1.1rem; cursor: pointer; overflow: hidden; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 10px 30px rgba(255, 140, 0, 0.4); border: 2px solid rgba(255, 140, 0, 0.8); } .saiba-mais-btn:hover { transform: translateY(-5px) scale(1.05); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.6), 0 0 30px rgba(255, 140, 0, 0.5); letter-spacing: 1px; } .saiba-mais-btn:active { transform: translateY(-2px) scale(1.02); } .btn-text { position: relative; z-index: 2; font-weight: 700; letter-spacing: 0.5px; } .btn-icon { position: relative; z-index: 2; font-size: 1.3rem; transition: transform 0.4s ease; display: inline-block; } .saiba-mais-btn:hover .btn-icon { transform: translateX(8px); } .btn-bg { position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(135deg, #ff6400 0%, #ff4500 100%); z-index: 1; transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1); } .saiba-mais-btn:hover .btn-bg { left: 0; } .saiba-mais-btn::before { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.3); transform: translate(-50%, -50%); pointer-events: none; } .saiba-mais-btn:active::before { animation: ripple 0.6s ease-out; } @keyframes ripple { 0% { width: 0; height: 0; opacity: 1; } 100% { width: 300px; height: 300px; opacity: 0; } } /* Imagem da Logo na Seção Bem-Vindo */ .about-image { border-radius: 20px; box-shadow: 0 20px 60px rgba(255, 140, 0, 0.3); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); border: 3px solid rgba(255, 140, 0, 0.3); animation: floatLogo 3s ease-in-out infinite; } .about-image:hover { transform: translateY(-10px) scale(1.05); box-shadow: 0 30px 80px rgba(255, 140, 0, 0.5); border-color: rgba(255, 140, 0, 0.6); } @keyframes floatLogo { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-15px); } } /* Conteúdo principal da página inicial (secções seguintes organizadas) */ .home-main { width: 100%; max-width: 100%; margin: 0 auto; display: block; } /* Banner Destaques — largura total, fora da caixa das secções; visual fixo e chamativo */ section.home-destaques-banner { max-width: none !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; backdrop-filter: none; background: transparent; overflow: visible; transform: none !important; } section.home-destaques-banner:hover { transform: none !important; box-shadow: none !important; border-color: transparent !important; } section.home-destaques-banner::before { display: none !important; } .home-destaques-banner__band { position: relative; width: 100%; background: linear-gradient(180deg, rgba(8, 4, 18, 0.88) 0%, rgba(22, 12, 40, 0.75) 100%), linear-gradient(118deg, #5c2800 0%, #1a0f2e 38%, #2a1850 62%, #4a2008 100%); border-top: 4px solid #ff8c00; border-bottom: 4px solid #ff6600; box-shadow: 0 12px 48px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 200, 120, 0.18); padding: 2.75rem 1rem 3.35rem; } .home-destaques-banner__band::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0.14; background: radial-gradient(ellipse 70% 50% at 15% 25%, rgba(255, 140, 0, 0.5) 0%, transparent 55%), radial-gradient(ellipse 60% 45% at 88% 75%, rgba(255, 80, 0, 0.35) 0%, transparent 50%); } .home-destaques-banner__head { position: relative; z-index: 1; text-align: center; margin: 0 auto 2.35rem; max-width: 40rem; } .home-destaques-banner__eyebrow { font-size: 0.72rem; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 800; color: #ffb347; margin-bottom: 0.7rem; text-shadow: 0 0 22px rgba(255, 140, 0, 0.5); } section.home-destaques-banner h2#home-destaques-title { background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; font-size: clamp(2.15rem, 5.2vw, 3.15rem); font-weight: 800; letter-spacing: 0.03em; margin-bottom: 1rem; padding-bottom: 0.9rem; line-height: 1.12; } section.home-destaques-banner h2#home-destaques-title::after { background: linear-gradient(90deg, #ff8c00, #ffc266, #ff6600); width: 130px; height: 5px; border-radius: 3px; box-shadow: 0 0 26px rgba(255, 140, 0, 0.95); } .home-destaques-banner__lead { font-size: 1.07rem !important; line-height: 1.55 !important; color: rgba(248, 245, 255, 0.93) !important; margin-bottom: 1.35rem !important; text-align: center !important; } .home-destaques-banner__cta { font-weight: 800; border-radius: 999px; padding: 0.85rem 1.85rem; box-shadow: 0 8px 28px rgba(255, 140, 0, 0.45); } .home-destaques-banner__grid { position: relative; z-index: 1; align-items: flex-start; } .home-destaques-banner .promo-highlight-card { border-color: rgba(255, 190, 120, 0.5); box-shadow: 0 14px 44px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 140, 0, 0.25); height: auto; min-height: 0; } .home-destaques-banner .promo-highlight-media { aspect-ratio: 4 / 3; } /* Estatísticas: mesma largura que os cartões, 4 colunas iguais (grelha CSS) */ .home-destaques-banner__stats { position: relative; z-index: 1; width: 100%; max-width: 100%; margin-top: 0.35rem; padding-top: 1.25rem; border-top: 1px solid rgba(255, 160, 60, 0.22); } .home-destaques-banner__stats-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; width: 100%; } @media (min-width: 768px) { .home-destaques-banner__stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; } } @media (min-width: 1200px) { .home-destaques-banner__stats-grid { gap: 1.5rem; } } .home-destaques-banner__stats .stat-item { width: 100%; margin: 0; padding: 1.25rem 0.65rem; min-height: 5.75rem; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-sizing: border-box; } .home-destaques-banner__stats .stat-number { font-size: clamp(1.75rem, 3.8vw, 2.35rem); margin-bottom: 0.35rem; } .home-destaques-banner__stats .stat-label { font-size: 0.65rem; letter-spacing: 0.1em; line-height: 1.3; max-width: 12rem; } .promo-highlights-row { align-items: stretch; } .promo-highlight-card { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; border-radius: 20px; overflow: hidden; border: 2px solid rgba(255, 140, 0, 0.35); background: var(--ft-card); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35); transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease; } .promo-highlight-card:hover { transform: translateY(-6px); border-color: rgba(255, 140, 0, 0.75); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.25); color: inherit; text-decoration: none; } .promo-highlight-media { position: relative; width: 100%; aspect-ratio: 16 / 10; background-size: cover; background-position: center; background-repeat: no-repeat; } .promo-highlight-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.65) 0%, transparent 55%); pointer-events: none; } .promo-highlight-media--vitela { background-position: center 15%; } .promo-highlight-body { padding: 1.25rem 1.35rem 1.5rem; text-align: center; } .promo-highlight-body h3 { font-size: 1.35rem; font-weight: 800; color: #ff8c00; margin-bottom: 0.35rem; text-shadow: 0 0 12px rgba(255, 140, 0, 0.35); } .promo-highlight-body p { font-size: 0.95rem; color: #e5e5ff; margin: 0; line-height: 1.45; } @media (max-width: 767.98px) { .promo-highlight-media { aspect-ratio: 16 / 11; } } /* Banner com Carrossel */ .banner-carousel { position: relative; width: 100%; max-width: 100%; height: 600px; background: #000; border-radius: 0; overflow: hidden; margin: 0 auto; padding: 0; box-shadow: 0 20px 60px rgba(255, 140, 0, 0.3); } .carousel-container { position: relative; width: 100%; height: 100%; overflow: hidden; } .carousel-slide { position: absolute; width: 100%; height: 100%; opacity: 0; transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1); background-size: cover !important; background-position: center !important; display: flex; align-items: center; justify-content: center; } .carousel-slide.active { opacity: 1; z-index: 10; } .carousel-slide::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 1; } .carousel-content { position: relative; z-index: 2; text-align: center; color: white; padding: 2rem; max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; } .carousel-title { font-size: 3.5rem; font-weight: 800; margin-bottom: 1rem; color: #fff; text-shadow: 0 4px 20px rgba(0, 0, 0, 0.8); letter-spacing: 1px; } .carousel-subtitle { font-size: 1.5rem; margin-bottom: 2rem; color: #e5e5e5; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8); } .carousel-btn { display: inline-block; padding: 1.2rem 3rem; background: linear-gradient(135deg, #ff8c00 0%, #ff6400 100%); color: white; text-decoration: none; border-radius: 50px; font-weight: 700; font-size: 1.1rem; transition: all 0.4s ease; box-shadow: 0 10px 30px rgba(255, 140, 0, 0.4); border: 2px solid rgba(255, 140, 0, 0.8); } .carousel-btn:hover { transform: translateY(-5px) scale(1.05); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.6); color: white; text-decoration: none; } .carousel-control { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 50px; background: rgba(255, 140, 0, 0.8); color: white; border: none; border-radius: 50%; font-size: 1.5rem; cursor: pointer; z-index: 20; transition: all 0.3s ease; box-shadow: 0 5px 20px rgba(255, 140, 0, 0.4); } .carousel-control:hover { background: #ff8c00; transform: translateY(-50%) scale(1.1); box-shadow: 0 10px 30px rgba(255, 140, 0, 0.6); } .carousel-control.prev { left: 20px; } .carousel-control.next { right: 20px; } .carousel-indicators { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; z-index: 20; } .indicator { width: 15px; height: 15px; border-radius: 50%; background: rgba(255, 255, 255, 0.5); cursor: pointer; transition: all 0.3s ease; border: 2px solid rgba(255, 140, 0, 0.5); } .indicator:hover { background: rgba(255, 140, 0, 0.7); transform: scale(1.2); } .indicator.active { background: #ff8c00; border-color: #ff6400; transform: scale(1.3); box-shadow: 0 0 20px rgba(255, 140, 0, 0.6); } /* Galeria */ .gallery-section { background: var(--ft-surface) !important; padding: 4rem 2rem !important; border-radius: 24px !important; margin: 3rem auto !important; max-width: 1200px !important; } .gallery-title { font-size: 2.8rem; font-weight: 800; text-align: center; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 0.5rem; } .gallery-subtitle { text-align: center; color: #e5e5e5; font-size: 1.1rem; margin-bottom: 3rem; } .gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; margin-top: 2rem; } .gallery-item { position: relative; overflow: hidden; border-radius: 15px; aspect-ratio: 4 / 3; box-shadow: 0 10px 30px rgba(255, 140, 0, 0.2); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); border: 2px solid rgba(255, 140, 0, 0.3); cursor: pointer; } .gallery-item:hover { transform: translateY(-10px) scale(1.02); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.4); border-color: rgba(255, 140, 0, 0.6); } .gallery-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; } .gallery-item:hover .gallery-img { transform: scale(1.1); } .gallery-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); display: flex; align-items: center; justify-content: center; opacity: 0; transition: all 0.4s ease; backdrop-filter: blur(5px); } .gallery-item:hover .gallery-overlay { opacity: 1; } .gallery-icon { font-size: 2.5rem; color: #ff8c00; text-shadow: 0 0 20px rgba(255, 140, 0, 0.6); animation: zoom-icon 0.4s ease; } @keyframes zoom-icon { 0% { transform: scale(0.5); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } /* Responsivo */ @media (max-width: 768px) { .carousel-title { font-size: 2rem; } .carousel-subtitle { font-size: 1rem; } .carousel-btn { padding: 0.8rem 2rem; font-size: 0.9rem; } .gallery-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.5rem; } .gallery-title { font-size: 2rem; } .saiba-mais-btn { padding: 1.2rem 2.5rem; font-size: 1rem; } } @media (max-width: 480px) { .banner-carousel { height: 520px; /* em vez de 600px */ max-height: 70vh; /* não passa de 70% da altura do ecrã */ } .carousel-title { font-size: 1.5rem; } .carousel-control { width: 40px; height: 40px; font-size: 1.2rem; } .gallery-grid { grid-template-columns: 1fr; } } /* ===== LIGHTBOX GALERIA ===== */ .lightbox { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.95); z-index: 9999; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s ease; } .lightbox.active { display: flex; opacity: 1; } .lightbox-content { position: relative; max-width: 90%; max-height: 90%; display: flex; align-items: center; justify-content: center; } .lightbox-img { max-width: 100%; max-height: 90vh; object-fit: contain; border-radius: 8px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5); } .lightbox-close { position: absolute; top: -50px; right: 0; color: #fff; font-size: 3rem; cursor: pointer; transition: transform 0.3s ease; line-height: 1; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 140, 0, 0.8); } .lightbox-close:hover { transform: rotate(90deg); background: rgba(255, 140, 0, 1); } .lightbox-prev, .lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255, 140, 0, 0.8); color: #fff; border: none; font-size: 2rem; padding: 1rem 1.5rem; cursor: pointer; border-radius: 8px; transition: all 0.3s ease; z-index: 10000; } .lightbox-prev { left: -80px; } .lightbox-next { right: -80px; } .lightbox-prev:hover, .lightbox-next:hover { background: rgba(255, 140, 0, 1); transform: translateY(-50%) scale(1.1); } @media (max-width: 768px) { .lightbox-prev { left: 10px; } .lightbox-next { right: 10px; } .lightbox-close { top: 10px; right: 10px; } } /* ===== BOTÃO WHATSAPP FLUTUANTE ("Fala connosco" - em cima) ===== */ .whatsapp-float { position: fixed; bottom: 98px; right: 30px; width: 60px; height: 60px; background: #25D366; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); z-index: 1000; transition: all 0.3s ease; animation: pulse-whatsapp 2s infinite; } .whatsapp-float:hover { transform: scale(1.1); box-shadow: 0 6px 30px rgba(37, 211, 102, 0.6); } .whatsapp-float svg { width: 32px; height: 32px; } .whatsapp-tooltip { position: absolute; right: 70px; top: 50%; transform: translateY(-50%); background: #25D366; color: #fff; padding: 8px 15px; border-radius: 20px; font-size: 0.9rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); } .whatsapp-float:hover .whatsapp-tooltip { opacity: 1; } @keyframes pulse-whatsapp { 0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); } 50% { box-shadow: 0 4px 30px rgba(37, 211, 102, 0.7); } } @media (max-width: 768px) { .whatsapp-float { width: 55px; height: 55px; bottom: 82px; right: 20px; } .whatsapp-tooltip { display: none; } } /* ===== CHAT ASSISTENTE (DÚVIDAS) - no canto onde estava o WhatsApp ===== */ #chat-assistant-wrap { position: fixed; bottom: 30px; right: 30px; z-index: 1000; } .chat-assistant-btn { width: 56px; height: 56px; border-radius: 50%; border: none; background: linear-gradient(135deg, #ff8c00 0%, #ffa500 100%); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(255, 140, 0, 0.45); transition: transform 0.2s ease, box-shadow 0.2s ease; } .chat-assistant-btn:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(255, 140, 0, 0.6); } .chat-assistant-btn i { font-size: 1.4rem; } .chat-assistant-tooltip { position: absolute; right: 65px; top: 50%; transform: translateY(-50%); background: linear-gradient(135deg, #ff8c00 0%, #ffa500 100%); color: #fff; padding: 8px 14px; border-radius: 20px; font-size: 0.85rem; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 0.25s ease; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2); } .chat-assistant-btn:hover .chat-assistant-tooltip { opacity: 1; } .chat-assistant-panel { position: absolute; bottom: 70px; right: 0; width: 360px; max-width: calc(100vw - 24px); height: 440px; max-height: 80vh; background: var(--ft-chat-panel); border: 1px solid rgba(255, 140, 0, 0.35); border-radius: 16px; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 140, 0, 0.1); display: flex; flex-direction: column; overflow: hidden; } .chat-assistant-header { padding: 12px 14px; background: rgba(255, 140, 0, 0.2); border-bottom: 1px solid rgba(255, 140, 0, 0.25); display: flex; align-items: center; justify-content: space-between; } .chat-assistant-title { font-weight: 700; font-size: 0.95rem; color: #ff8c00; } .chat-assistant-title i { margin-right: 6px; } .chat-assistant-close { width: 32px; height: 32px; border: none; background: transparent; color: #e5e5e5; cursor: pointer; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: background 0.2s, color 0.2s; } .chat-assistant-close:hover { background: rgba(255, 140, 0, 0.3); color: #ff8c00; } .chat-assistant-header-btns { display: flex; align-items: center; gap: 4px; } .chat-assistant-clear { width: 32px; height: 32px; border: none; background: transparent; color: rgba(255, 255, 255, 0.5); border-radius: 8px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 0.8rem; transition: background 0.2s, color 0.2s; } .chat-assistant-clear:hover { background: rgba(255, 80, 80, 0.18); color: #ff6b6b; } .chat-assistant-messages { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 10px; } .chat-assistant-msg { max-width: 88%; align-self: flex-start; } .chat-assistant-msg-user { align-self: flex-end; } .chat-assistant-msg-content { padding: 10px 14px; border-radius: 14px; font-size: 0.9rem; line-height: 1.4; white-space: pre-line; } .chat-assistant-msg-bot .chat-assistant-msg-content { background: rgba(255, 140, 0, 0.15); border: 1px solid rgba(255, 140, 0, 0.25); color: #e5e5e5; } .chat-assistant-msg-user .chat-assistant-msg-content { background: linear-gradient(135deg, #ff8c00 0%, #ffa500 100%); color: #fff; } /* Typing animation */ .chat-assistant-msg-typing { display: flex; align-items: center; gap: 4px; padding: 12px 16px !important; } .typing-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: rgba(255, 140, 0, 0.7); animation: typingBounce 1.1s infinite ease-in-out; } .typing-dot:nth-child(2) { animation-delay: 0.18s; } .typing-dot:nth-child(3) { animation-delay: 0.36s; } @keyframes typingBounce { 0%, 60%, 100% { transform: translateY(0); opacity: 0.5; } 30% { transform: translateY(-6px); opacity: 1; } } /* Action buttons (Ligar, WhatsApp, Ver no mapa) */ .chat-assistant-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 8px 10px; } .chat-assistant-action-btn { display: inline-flex; align-items: center; gap: 5px; padding: 5px 13px; border-radius: 20px; font-size: 0.78rem; font-weight: 600; text-decoration: none !important; background: rgba(255, 140, 0, 0.12); border: 1px solid rgba(255, 140, 0, 0.38); color: #ffb257 !important; transition: background 0.2s, color 0.2s; } .chat-assistant-action-btn:hover { background: rgba(255, 140, 0, 0.28); color: #fff !important; } .chat-assistant-quick { padding: 8px 12px; display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px solid rgba(255, 255, 255, 0.06); } .chat-assistant-quick-btn { padding: 6px 12px; font-size: 0.8rem; border: 1px solid rgba(255, 140, 0, 0.4); background: transparent; color: #ff8c00; border-radius: 20px; cursor: pointer; transition: background 0.2s, color 0.2s; } .chat-assistant-quick-btn:hover { background: rgba(255, 140, 0, 0.25); color: #fff; } /* Botões de escolha Vitela / Porco / Aves (após pergunta assar/cozer/grelhar) */ .chat-assistant-choices { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0 4px; align-self: flex-start; } .chat-assistant-choice-btn { padding: 10px 16px; font-size: 0.9rem; font-weight: 600; border: 2px solid rgba(255, 140, 0, 0.5); background: rgba(255, 140, 0, 0.15); color: #ff8c00; border-radius: 24px; cursor: pointer; transition: background 0.2s, color 0.2s, transform 0.15s; } .chat-assistant-choice-btn:hover { background: rgba(255, 140, 0, 0.35); color: #fff; transform: scale(1.03); } .chat-assistant-input-wrap { padding: 10px 12px; display: flex; gap: 8px; border-top: 1px solid rgba(255, 255, 255, 0.08); } .chat-assistant-input { flex: 1; padding: 10px 14px; border: 1px solid rgba(255, 140, 0, 0.35); border-radius: 22px; background: rgba(0, 0, 0, 0.25); color: #e5e5e5; font-size: 0.9rem; outline: none; transition: border-color 0.2s, box-shadow 0.2s; } .chat-assistant-input::placeholder { color: rgba(229, 229, 229, 0.5); } .chat-assistant-input:focus { border-color: #ff8c00; box-shadow: 0 0 0 2px rgba(255, 140, 0, 0.2); } .chat-assistant-send { width: 42px; height: 42px; border: none; border-radius: 50%; background: linear-gradient(135deg, #ff8c00 0%, #ffa500 100%); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: transform 0.2s, box-shadow 0.2s; } .chat-assistant-send:hover { transform: scale(1.05); box-shadow: 0 4px 16px rgba(255, 140, 0, 0.5); } @media (max-width: 768px) { #chat-assistant-wrap { bottom: 20px; right: 20px; } .chat-assistant-btn { width: 50px; height: 50px; } .chat-assistant-tooltip { display: none; } .chat-assistant-panel { width: calc(100vw - 20px); right: -10px; bottom: 65px; height: 400px; } } /* ===== ANIMAÇÕES DE SCROLL ===== */ .fade-in { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; } .fade-in.animate-in { opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { .fade-in { opacity: 1; transform: none; transition: none; } } /* ===== VALIDAÇÃO DE FORMULÁRIOS ===== */ .form-control.is-valid { border-color: #25D366; background-image: url("data:image/svg+xml,%3csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2325D366' d='m2.3 6.73.98-.98-.98-.98-.98.98.98.98zm1.38-1.38L4.78 4.1l-.98-.98-1.1 1.1.98.98z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); padding-right: calc(1.5em + 0.75rem); } .form-control.is-invalid { border-color: #dc3545; background-image: url("data:image/svg+xml,%3csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3cpath d='m4.5 4.5 3 3m0-3-3 3'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: right calc(0.375em + 0.1875rem) center; background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem); padding-right: calc(1.5em + 0.75rem); } .invalid-feedback { display: block; width: 100%; margin-top: 0.25rem; font-size: 0.875rem; color: #dc3545; } /* ===== FORMULÁRIOS EM CARDS / CONTACTO ===== */ .card .form-label, section .card .form-label { color: #fff !important; } .card .form-control, section .card .form-control { background: rgba(10, 5, 25, 0.5); border: 1px solid rgba(255, 140, 0, 0.35); color: #fff !important; } .card .form-control::placeholder { color: rgba(255, 255, 255, 0.5); } .card .form-select, section .card .form-select { background: rgba(10, 5, 25, 0.5); border: 1px solid rgba(255, 140, 0, 0.35); color: #fff !important; } .card .form-select option { background: var(--ft-page-2); color: #fff; } .card .form-check-label, section .card .form-check-label { color: #fff !important; } .card .form-control:focus, .card .form-control:focus-visible, .card .form-select:focus { background-color: rgba(10, 5, 25, 0.92) !important; border-color: rgba(255, 140, 0, 0.6); box-shadow: 0 0 0 0.2rem rgba(255, 140, 0, 0.2); color: #fff !important; } section .card .form-control:-webkit-autofill, section .card .form-control:-webkit-autofill:focus, .card .form-control:-webkit-autofill, .card .form-control:-webkit-autofill:focus { -webkit-text-fill-color: #fff !important; caret-color: #fff; box-shadow: 0 0 0 1000px rgba(10, 5, 25, 0.95) inset !important; border: 1px solid rgba(255, 140, 0, 0.45); transition: background-color 99999s ease-out 0s; } /* ===== LAZY LOADING IMAGENS ===== */ /* Evitar opacity:0 em todas as img lazy sem lazy-load.js em cada página (ficavam invisíveis). */ /* ----- Página Funcionários (colaboradores.html) ----- */ /* Títulos da página Funcionários em laranja vivo */ #colaboradores-hero h2, #valores-equipa h3, #equipa-principal h3, section.bg-gradient h3 { color: #ff8c00 !important; -webkit-text-fill-color: #ff8c00 !important; /* caso algum tenha gradient */ text-shadow: 0 0 10px rgba(255, 140, 0, 0.6); } .colaboradores-hero-section .lead, .colaboradores-hero-lead { color: #d1d5db !important; max-width: 600px; margin-left: auto; margin-right: auto; } /* Secção "O que nos define": ícones laranja, texto branco */ #valores-equipa .icon-box i { color: #ff8c00 !important; text-shadow: 0 0 12px rgba(255, 140, 0, 0.6); } #valores-equipa .icon-box h5 { color: #fff !important; } #valores-equipa .icon-box p, #valores-equipa .icon-box .small { color: #fff !important; } /* Foto de grupo – equipa em grande (página Funcionários) */ #foto-equipa-grupo { background: transparent; /* Cartão da secção: sem padding extra — a foto usa toda a largura útil */ padding: 0 !important; margin-block: 0.75rem !important; } /* Bootstrap: container-fluid ainda pode trazer gutter — força 0 nesta faixa */ #foto-equipa-grupo .container-fluid { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; margin: 0 !important; } /* Menos espaço entre o bloco da foto e a secção seguinte (cartões Experiência / …) */ #foto-equipa-grupo + section { margin-top: 0.75rem !important; } #colaboradores-hero + #foto-equipa-grupo { margin-top: 0.75rem !important; } .equipa-grupo-wrapper { position: relative; width: 100%; max-width: none; margin: 0; overflow: hidden; /* Uma só moldura: cantos vêm do `section` (overflow:hidden + border-radius) */ border-radius: 0; border: 0; box-shadow: none; background: var(--ft-surface-soft); height: clamp(180px, min(36vw, 50vh), 480px); } .equipa-grupo-img { position: absolute !important; top: 0 !important; bottom: 0 !important; left: 50% !important; right: auto !important; width: 132% !important; height: 100% !important; max-width: none !important; transform: translateX(-50%); object-fit: cover !important; object-position: center center; display: block; } .equipa-grupo-placeholder { display: none; position: absolute; inset: 0; z-index: 1; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; padding: 1.5rem; color: rgba(255, 140, 0, 0.7); font-size: 1.1rem; text-align: center; background: var(--ft-surface-soft); } .equipa-grupo-placeholder i { font-size: 4rem; opacity: 0.6; } /* ===== HOME — hero, produtos, testemunhos, galeria, contacto rápido (bloco partilhado) ===== */ .hero { min-height: max(34rem, min(92vh, 58rem)); min-height: max(34rem, min(92svh, 58rem)); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; background-image: linear-gradient(rgba(8, 6, 22, 0.72), rgba(4, 3, 14, 0.82)), url('../Imagens/Talho/Imagensgaleria3.jpeg'); background-size: cover; background-position: center 36%; background-repeat: no-repeat; padding: 2.5rem 1.25rem; } .hero .hero-content, .hero-content { text-align: center; position: relative; z-index: 2; max-width: 800px; } .hero .hero-title, .hero-title { font-size: 4.5rem; font-weight: 800; margin-bottom: 1.5rem; background: var(--ft-accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; text-shadow: 0 0 40px rgba(255, 140, 0, 0.5); animation: fadeInUp 1s ease; } .hero .hero-subtitle, .hero-subtitle { font-size: 1.5rem; color: #e5e5e5; margin-bottom: 2.5rem; line-height: 1.5; animation: fadeInUp 1.2s ease; } .hero .hero-buttons, .hero-buttons { display: flex; flex-wrap: wrap; gap: 1.5rem; justify-content: center; animation: fadeInUp 1.4s ease; } .hero-btn { padding: 1rem 2.5rem; font-size: 1.1rem; font-weight: 600; border-radius: 50px; text-decoration: none; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 0.5rem; } .hero-btn-primary { background: var(--ft-accent-gradient-btn); color: #fff; box-shadow: 0 8px 25px rgba(255, 140, 0, 0.4); } .hero-btn-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 35px rgba(255, 140, 0, 0.6); color: #fff; } .hero-btn-secondary { background: transparent; color: #ff8c00; border: 2px solid #ff8c00; } .hero-btn-secondary:hover { background: rgba(255, 140, 0, 0.1); transform: translateY(-3px); color: #ff8c00; } .stats-container { max-width: 1100px; /* ligeiramente mais estreito */ padding: 2.5rem 2rem; /* dá mais respiro em cima/baixo */ } .stats-container .row { width: 100%; display: flex; justify-content: center !important; align-items: stretch; margin: 0 auto; flex-wrap: wrap; } .stats-container .row > [class*="col-"] { display: flex; justify-content: center; } .stat-item { text-align: center; padding: 2.5rem 1.5rem; transition: all 0.4s ease; background: rgba(38, 22, 62, 0.45); border-radius: 20px; border: 2px solid rgba(255, 140, 0, 0.2); margin: 0.5rem; display: flex; flex-direction: column; justify-content: center; align-items: center; } .stat-item:hover { transform: translateY(-10px) scale(1.05); background: rgba(38, 22, 62, 0.65); border-color: rgba(255, 140, 0, 0.5); box-shadow: 0 15px 40px rgba(255, 140, 0, 0.3); } .stat-number { font-size: 4rem; font-weight: 800; background: var(--ft-accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 0.8rem; display: block; line-height: 1; text-shadow: 0 0 30px rgba(255, 140, 0, 0.3); } .stat-label { font-size: 1rem; color: #d1d5db; text-transform: uppercase; letter-spacing: 2px; font-weight: 600; display: block; } .products-preview { padding: 5rem 0; } .product-card { background: var(--ft-card); border-radius: 20px; overflow: hidden; border: 2px solid rgba(255, 140, 0, 0.3); transition: all 0.4s ease; height: 100%; } .product-card:hover { transform: translateY(-10px); border-color: rgba(255, 140, 0, 0.6); box-shadow: 0 20px 40px rgba(255, 140, 0, 0.3); } .product-card img { width: 100%; height: 250px; object-fit: cover; transition: transform 0.4s ease; } .product-card:hover img { transform: scale(1.1); } .product-card-body { padding: 2rem; } .product-card-title { font-size: 1.5rem; font-weight: 700; color: #ff8c00; margin-bottom: 1rem; } .testimonials-section { background: var(--ft-surface); padding: 5rem 0; } .testimonial-card { background: rgba(38, 22, 62, 0.55); border-radius: 20px; padding: 2.5rem; border: 2px solid rgba(255, 140, 0, 0.2); height: 100%; transition: all 0.3s ease; } .testimonial-card:hover { border-color: rgba(255, 140, 0, 0.5); transform: translateY(-5px); } .testimonial-text { font-size: 1.1rem; font-style: italic; color: #d1d5db; margin-bottom: 1.5rem; line-height: 1.8; } .testimonial-author { display: flex; align-items: center; gap: 1rem; } .testimonial-author-name { font-weight: 600; color: #ff8c00; font-size: 1.1rem; } .testimonial-stars { color: #ff8c00; margin-bottom: 1rem; } .testimonial-card--external .testimonial-stars { font-size: 1.5rem; } .testimonial-source { font-size: 0.95rem; font-weight: 700; color: #ff8c00; letter-spacing: 0.02em; } .testimonial-card--external .testimonial-text { font-style: normal; } .quick-contact { background: var(--ft-surface); padding: 3rem 0; border-radius: 0; } .quick-contact-item { text-align: center; padding: 1.5rem; } .quick-contact-icon { font-size: 2.5rem; color: #ff8c00; margin-bottom: 1rem; } .quick-contact-link { color: #fff; text-decoration: none; font-size: 1.1rem; transition: color 0.3s ease; } .quick-contact-link:hover { color: #ff8c00; } /* Melhorias na Galeria */ .gallery-section-enhanced { padding: 6rem 0; background: var(--ft-surface); position: relative; overflow: hidden; } .gallery-section-enhanced::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: radial-gradient(circle at 20% 30%, rgba(255, 140, 0, 0.1) 0%, transparent 50%), radial-gradient(circle at 80% 70%, rgba(255, 102, 0, 0.1) 0%, transparent 50%); pointer-events: none; } .gallery-title-enhanced { font-size: 3.5rem; font-weight: 800; text-align: center; margin-bottom: 1rem; background: var(--ft-accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; position: relative; padding-bottom: 1.5rem; } .gallery-title-enhanced::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 150px; height: 5px; background: linear-gradient(90deg, #ff8c00, #ff6600, #ffa500); border-radius: 3px; box-shadow: 0 0 20px rgba(255, 140, 0, 0.8); } .gallery-subtitle-enhanced { text-align: center; font-size: 1.3rem; color: #d1d5db; margin-bottom: 3rem; font-weight: 300; } .gallery-grid-enhanced { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; padding: 2rem 0; max-width: 1400px; margin: 0 auto; } .gallery-item-enhanced { position: relative; border-radius: 20px; overflow: hidden; aspect-ratio: 4/3; cursor: pointer; transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); border: 3px solid rgba(255, 140, 0, 0.2); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); } .gallery-item-enhanced:hover { transform: translateY(-15px) scale(1.02); border-color: rgba(255, 140, 0, 0.6); box-shadow: 0 20px 50px rgba(255, 140, 0, 0.4); } .gallery-img-enhanced { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; } .gallery-item-enhanced:hover .gallery-img-enhanced { transform: scale(1.15); } .gallery-overlay-enhanced { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, transparent 50%); display: flex; align-items: flex-end; justify-content: center; padding: 2rem; opacity: 0; transition: opacity 0.4s ease; } .gallery-item-enhanced:hover .gallery-overlay-enhanced { opacity: 1; } .gallery-icon-enhanced { font-size: 3rem; color: #ff8c00; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(10px); width: 70px; height: 70px; border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; box-shadow: 0 5px 20px rgba(255, 140, 0, 0.5); } .gallery-item-enhanced:hover .gallery-icon-enhanced { transform: scale(1.2) rotate(5deg); background: rgba(255, 140, 0, 0.3); } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @media (max-width: 768px) { .hero-title { font-size: 2.5rem; } .hero-subtitle { font-size: 1.2rem; } .stat-number { font-size: 2.5rem; } .gallery-title-enhanced { font-size: 2.5rem; } .gallery-grid-enhanced { grid-template-columns: 1fr; gap: 1.5rem; } .stat-item { margin: 0.25rem; padding: 2rem 1rem; width: 100%; max-width: 200px; } .stats-container { padding: 0 1rem; } .stats-container .row { justify-content: center; max-width: 100%; } } /* ===== PÁGINAS INTERNAS (.page-main, secções sem foto equipa) ===== */ .page-main { width: 100%; max-width: 100%; padding-bottom: 2.5rem; } body:not([data-page="home"]) section:not(.home-destaques-banner):not(#foto-equipa-grupo)::before { opacity: 0.22; } @media (hover: hover) and (pointer: fine) { body:not([data-page="home"]) section:not(.home-destaques-banner):not(#foto-equipa-grupo):hover { transform: translateY(-5px); box-shadow: 0 26px 64px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 160, 80, 0.26), inset 0 1px 0 rgba(255, 225, 190, 0.08), 0 0 40px rgba(255, 120, 0, 0.1); border-color: rgba(255, 185, 100, 0.38); } body:not([data-page="home"]) section:not(.home-destaques-banner):not(#foto-equipa-grupo):hover::before { opacity: 0.42; } } /* ===== PÁGINA INICIAL (data-page="home") ===== */ body[data-page="home"] { --home-surface: var(--ft-surface); --home-surface-border: rgba(255, 160, 60, 0.24); --home-surface-shadow: 0 22px 56px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 130, 50, 0.12), inset 0 1px 0 rgba(255, 210, 170, 0.08); --home-title-color: #ff8c00; --home-title-line: linear-gradient(90deg, transparent, rgba(255, 200, 110, 0.95), transparent); } /* Mesmo “vidro” roxo/laranja em Sobre, Galeria, Avaliações e Contacto */ body[data-page="home"] .home-main > section:not(.hero):not(.home-destaques-banner) { background: var(--home-surface); border: 1px solid var(--home-surface-border); box-shadow: var(--home-surface-shadow); backdrop-filter: blur(10px) saturate(140%); transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease; } body[data-page="home"] .home-main > section:not(.hero):not(.home-destaques-banner)::before { opacity: 0.28; } @media (hover: hover) and (pointer: fine) { body[data-page="home"] .home-main > section:not(.hero):not(.home-destaques-banner):hover { transform: translateY(-5px); border-color: rgba(255, 185, 100, 0.38); box-shadow: 0 28px 68px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(255, 160, 80, 0.26), inset 0 1px 0 rgba(255, 225, 190, 0.1), 0 0 52px rgba(255, 120, 0, 0.12); } body[data-page="home"] .home-main > section:not(.hero):not(.home-destaques-banner):hover::before { opacity: 0.48; } } /* Hero: altura mínima forte + scroll (nunca fixed) + ligação suave aos destaques */ body[data-page="home"] .home-main > section.hero { max-width: none; width: 100%; margin-left: 0; margin-right: 0; min-height: max(36rem, min(94vh, 58rem)); min-height: max(36rem, min(94svh, 58rem)); padding: clamp(2rem, 5vw, 3.5rem) 1.25rem; border-radius: 0; border: none; border-bottom: none; box-shadow: inset 0 -80px 90px -20px rgba(8, 4, 18, 0.75), 0 20px 50px rgba(0, 0, 0, 0.35); backdrop-filter: none; background-color: #0c0614; background-image: radial-gradient(ellipse 100% 70% at 50% 0%, rgba(255, 130, 40, 0.12) 0%, transparent 50%), linear-gradient(180deg, rgba(16, 8, 32, 0.55) 0%, rgba(6, 3, 14, 0.82) 55%, rgba(4, 2, 10, 0.92) 100%), url('../Imagens/Talho/Imagensgaleria3.jpeg'); background-size: cover; background-position: center 34%; background-repeat: no-repeat; background-attachment: scroll; margin-bottom: 0 !important; } body[data-page="home"] .home-main > section.hero::before { display: none !important; } body[data-page="home"] .home-main > section.hero:hover { transform: none !important; box-shadow: inset 0 -80px 90px -20px rgba(8, 4, 18, 0.75), 0 24px 56px rgba(0, 0, 0, 0.38); border-color: transparent; } body[data-page="home"] .home-main > section.hero + .home-destaques-banner { margin-top: 0 !important; } body[data-page="home"] .home-main > section.hero + .home-destaques-banner .home-destaques-banner__band { margin-top: -1px; border-top: 2px solid rgba(255, 160, 90, 0.5); box-shadow: 0 -24px 48px rgba(8, 4, 18, 0.45), 0 12px 48px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 200, 120, 0.16); } /* Faixa destaques: mesma família cromática do resto da home */ body[data-page="home"] .home-destaques-banner__band { background: linear-gradient(180deg, rgba(10, 6, 20, 0.92) 0%, rgba(22, 12, 42, 0.88) 100%), linear-gradient(118deg, #4a2200 0%, #1a0f2e 38%, #281850 62%, #3d1a08 100%); } .skip-to-content { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .skip-to-content:focus { position: fixed; left: 50%; top: 1rem; transform: translateX(-50%); width: auto; height: auto; margin: 0; padding: 0.75rem 1.35rem; clip: auto; overflow: visible; white-space: normal; z-index: 1100; background: linear-gradient(135deg, #ffb347, #ff8c00); color: #1a0a00 !important; font-weight: 800; font-size: 0.95rem; border-radius: 12px; box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45); text-decoration: none; } body[data-page="home"] .home-main > section:first-child.hero { margin-top: 0; } .home-testimonials__intro { max-width: 44rem; } .home-testimonials__more-links { opacity: 0.88; } .home-review-cta-panel { max-width: 52rem; } .home-review-cta-lead { opacity: 0.92; } .review-invite-stars-wrap--narrow { max-width: 22rem; } .review-cta-btn--inline { width: auto !important; min-width: 14rem; } .home-review-cta-steps { max-width: 24rem; } body[data-page="home"] .home-cta .section-title { background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; } body[data-page="home"] .home-cta .section-title::after { background: var(--home-title-line) !important; box-shadow: 0 0 14px rgba(255, 170, 80, 0.45); } body[data-page="home"] .hero-subtitle--home { max-width: 34rem; margin-left: auto; margin-right: auto; } .hero-destaques-link { margin-top: 1.75rem; text-align: center; } .hero-destaques-link a { color: rgba(255, 200, 140, 0.95); font-weight: 600; font-size: 1rem; text-decoration: none; letter-spacing: 0.02em; transition: color 0.25s ease, text-shadow 0.25s ease; text-shadow: 0 1px 12px rgba(0, 0, 0, 0.45); } .hero-destaques-link a:hover { color: #fff; text-shadow: 0 0 18px rgba(255, 140, 0, 0.55); } .hero-destaques-link i { display: inline-block; margin-right: 0.35rem; font-size: 0.85em; opacity: 0.9; } body[data-page="home"] .home-main { padding-bottom: 0.25rem; } body[data-page="home"] .home-main > section { margin-top: 2.25rem; margin-bottom: 2.25rem; } @media (min-width: 992px) { body[data-page="home"] .home-main > section.home-destaques-banner { margin-top: 0; } } body[data-page="home"] .home-stats .stat-item { border-color: rgba(255, 140, 0, 0.28); background: rgba(35, 22, 62, 0.55); } body[data-page="home"] .home-about .section-text { max-width: 36rem; text-align: center; margin-left: auto; margin-right: auto; font-weight: 500; color: #eceef2; line-height: 1.7; } @media (min-width: 768px) { body[data-page="home"] .home-about__text .section-text { text-align: start; margin-left: 0; margin-right: 0; } } body[data-page="home"] .home-about__head .section-title { text-align: center; width: 100%; max-width: none; margin-left: auto; margin-right: auto; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; } body[data-page="home"] .home-about__head .section-title::after { background: var(--home-title-line) !important; box-shadow: 0 0 14px rgba(255, 170, 80, 0.45); } body[data-page="home"] .home-about__logo-wrap { display: inline-block; padding: 1.25rem 1.5rem; border-radius: 1.25rem; background: linear-gradient(165deg, rgba(28, 16, 48, 0.92) 0%, rgba(14, 6, 28, 0.97) 100%); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 140, 0, 0.28); animation: floatLogo 3s ease-in-out infinite; } body[data-page="home"] .home-about__logo { display: block; max-width: min(320px, 82vw); width: 100%; height: auto; margin: 0 auto; border-radius: 0.65rem; } @media (min-width: 768px) { body[data-page="home"] .home-about__logo { max-width: min(360px, 100%); margin: 0; } } body[data-page="home"] .home-about .about-features { gap: 0.75rem; margin: 1.5rem 0 1.75rem; } body[data-page="home"] .home-about .feature-btn:hover { transform: translateX(6px); } body[data-page="home"] .home-gallery.gallery-section-enhanced { padding-top: 4.25rem; padding-bottom: 4.25rem; background: transparent !important; content-visibility: auto; contain-intrinsic-size: auto 1100px; } body[data-page="home"] .home-gallery.gallery-section-enhanced::before { opacity: 0.22; } body[data-page="home"] .gallery-title-enhanced { background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; font-size: clamp(2rem, 4.5vw, 3.2rem); } body[data-page="home"] .gallery-title-enhanced::after { background: var(--home-title-line) !important; box-shadow: 0 0 14px rgba(255, 170, 80, 0.45); width: 120px; height: 4px; } body[data-page="home"] .gallery-subtitle-enhanced { color: rgba(248, 245, 255, 0.88) !important; font-weight: 500; font-size: 1.12rem !important; margin-bottom: 2.5rem !important; } body[data-page="home"] .gallery-section-enhanced__inner { position: relative; z-index: 1; } body[data-page="home"] .home-testimonials.testimonials-section { padding-top: 4rem; padding-bottom: 4rem; background: transparent !important; border: none !important; box-shadow: none !important; } body[data-page="home"] .home-testimonials .section-title { background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ff9500 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; } body[data-page="home"] .home-testimonials .section-title::after { background: var(--home-title-line) !important; box-shadow: 0 0 14px rgba(255, 170, 80, 0.45); } body[data-page="home"] .home-cta.quick-contact { padding-top: 3.5rem; padding-bottom: 3.5rem; border-radius: 24px; margin-bottom: 2.5rem; background: transparent !important; } body[data-page="home"] .home-cta .quick-contact-item { padding: 1.75rem 1.25rem; border-radius: 16px; background: rgba(22, 12, 42, 0.48); border: 1px solid rgba(255, 160, 60, 0.22); height: 100%; transition: border-color 0.3s ease, box-shadow 0.3s ease; } body[data-page="home"] .home-cta .quick-contact-item:hover { border-color: rgba(255, 140, 0, 0.45); box-shadow: 0 12px 32px rgba(255, 140, 0, 0.12); } body[data-page="home"] .home-about .saiba-mais-container { justify-content: center; } @media (min-width: 768px) { body[data-page="home"] .home-about__text .saiba-mais-container { justify-content: flex-start; } } html { scroll-padding-top: 88px; } .testimonial-stars--lg { font-size: 2.75rem; margin-bottom: 0.5rem; } /* Secção avaliações: painel convite (visual alinhado ao mockup “neon”) */ .review-invite-panel { display: flex; flex-direction: column; padding: 1.75rem 1.5rem 1.5rem; border-radius: 24px; background: linear-gradient(168deg, rgba(42, 24, 63, 0.92) 0%, rgba(26, 11, 46, 0.95) 45%, rgba(14, 5, 26, 0.98) 100%); border: 1px solid rgba(255, 190, 100, 0.5); box-shadow: 0 0 0 1px rgba(255, 210, 140, 0.1) inset, 0 14px 44px rgba(0, 0, 0, 0.5), 0 0 36px rgba(255, 140, 0, 0.22); } .review-invite-panel__title { display: flex; align-items: center; justify-content: center; gap: 0.55rem; flex-wrap: wrap; font-size: 1.45rem; font-weight: 800; color: #fff; margin: 0 0 0.75rem; letter-spacing: 0.02em; } @media (min-width: 992px) { .review-invite-panel__title { justify-content: flex-start; } } .review-invite-panel__g { display: inline-flex; align-items: center; justify-content: center; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: #fff; box-shadow: 0 0 14px rgba(255, 200, 80, 0.35); } .review-invite-panel__g .fa-google { font-size: 1.15rem; background: conic-gradient( #4285f4 0deg 90deg, #ea4335 90deg 180deg, #fbbc04 180deg 270deg, #34a853 270deg 360deg ); -webkit-background-clip: text; background-clip: text; color: transparent; } .review-invite-panel__lead { margin: 0 0 1.1rem; font-size: 1rem; line-height: 1.6; color: rgba(255, 255, 255, 0.92); } .review-invite-stars-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.45rem; padding: 1.25rem 1rem 1.1rem; border-radius: 18px; text-decoration: none; color: inherit; background: rgba(10, 5, 24, 0.55); border: 2px dashed rgba(255, 200, 100, 0.65); box-shadow: 0 0 24px rgba(255, 160, 40, 0.12); transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .review-invite-stars-wrap:hover { transform: scale(1.02); border-color: rgba(255, 220, 140, 0.95); background: rgba(35, 20, 58, 0.75); box-shadow: 0 0 32px rgba(255, 160, 50, 0.28); } .review-invite-stars-wrap:focus-visible { outline: 3px solid #ffb347; outline-offset: 3px; } .review-invite-stars-wrap__hint { font-size: 0.95rem; font-weight: 800; color: #ffc24a; letter-spacing: 0.03em; } .review-invite-stars { font-size: 2.1rem; letter-spacing: 0.18em; color: #ffdd55; line-height: 1; } .review-invite-stars .fa-star { filter: drop-shadow(0 0 14px rgba(255, 210, 80, 0.85)) drop-shadow(0 0 6px rgba(255, 140, 0, 0.6)); transition: transform 0.15s ease; } .review-invite-stars-wrap:hover .fa-star { transform: scale(1.1); } .review-invite-stars-wrap__sub { font-size: 0.8rem; color: rgba(230, 224, 255, 0.72); text-align: center; max-width: 22rem; } .review-invite-steps { padding: 0.9rem 1rem; border-radius: 14px; background: rgba(8, 4, 20, 0.65); border: 1px solid rgba(255, 160, 60, 0.28); } .review-invite-steps ol { padding-left: 1.15rem; margin: 0; color: rgba(255, 255, 255, 0.92); font-size: 0.9rem; line-height: 1.55; } .review-invite-steps strong { color: #ffb347; } .review-invite-panel__social-label { font-size: 0.78rem; font-weight: 700; color: rgba(255, 255, 255, 0.5); letter-spacing: 0.12em; text-transform: uppercase; } /* Botões da secção avaliações (substituem Bootstrap neste bloco) */ .review-cta-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 0.95rem 1.25rem; border-radius: 14px; font-size: 0.95rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; text-align: center; border: 2px solid transparent; cursor: pointer; transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease; } .review-cta-btn:hover { transform: translateY(-2px); color: inherit; } .review-cta-btn:focus-visible { outline: 3px solid #ffb347; outline-offset: 3px; } .review-cta-btn--primary { background: linear-gradient(180deg, #ffb347 0%, #ff9500 45%, #e86e00 100%); color: #1a0b12 !important; border-color: rgba(255, 230, 180, 0.55); box-shadow: 0 8px 28px rgba(255, 140, 0, 0.45); animation: review-invite-cta-pulse 2.6s ease-in-out infinite; } .review-cta-btn--primary:hover { color: #1a0b12 !important; box-shadow: 0 12px 36px rgba(255, 160, 40, 0.55); } .review-cta-btn--outline { background: rgba(18, 8, 32, 0.75); color: #ffe6b3 !important; border-color: rgba(255, 180, 80, 0.75); box-shadow: 0 0 20px rgba(255, 140, 0, 0.12); } .review-cta-btn--outline:hover { color: #fff !important; border-color: rgba(255, 210, 130, 0.95); background: rgba(40, 22, 70, 0.85); } .review-cta-btn--ghost { background: transparent; color: rgba(255, 255, 255, 0.75) !important; border-color: rgba(255, 255, 255, 0.28); font-weight: 700; font-size: 0.82rem; letter-spacing: 0.03em; text-transform: none; padding: 0.65rem 1rem; } .review-cta-btn--ghost:hover { color: #fff !important; border-color: rgba(255, 200, 120, 0.45); background: rgba(255, 255, 255, 0.05); } .review-cta-btn--social { width: auto; padding: 0.55rem 1rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.02em; text-transform: none; background: rgba(12, 6, 28, 0.5); color: #ffd18a !important; border-color: rgba(255, 180, 90, 0.45); } .review-cta-btn--social:hover { color: #fff !important; border-color: rgba(255, 210, 130, 0.75); } @keyframes review-invite-cta-pulse { 0%, 100% { box-shadow: 0 8px 28px rgba(255, 140, 0, 0.45), 0 0 0 0 rgba(255, 180, 60, 0.4); } 50% { box-shadow: 0 8px 28px rgba(255, 140, 0, 0.45), 0 0 0 12px rgba(255, 180, 60, 0); } } @media (prefers-reduced-motion: reduce) { .review-cta-btn--primary { animation: none; } .review-invite-stars-wrap:hover { transform: none; } .review-invite-stars-wrap:hover .fa-star { transform: none; } .review-cta-btn:hover { transform: none; } } .review-example-grid__title { font-size: 1.25rem; font-weight: 800; color: #fff; letter-spacing: 0.03em; text-shadow: 0 0 20px rgba(255, 160, 60, 0.25); } .review-example-chip { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; min-height: 128px; padding: 1rem 0.6rem; border-radius: 18px; text-align: center; text-decoration: none; color: #fff; background: linear-gradient(165deg, rgba(38, 22, 62, 0.95) 0%, rgba(18, 8, 32, 0.98) 100%); border: 1px solid rgba(255, 175, 90, 0.45); box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35), 0 0 20px rgba(255, 140, 0, 0.1); transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease; } .review-example-chip:hover { color: #fff; transform: translateY(-4px); border-color: rgba(255, 210, 130, 0.75); box-shadow: 0 14px 36px rgba(0, 0, 0, 0.4), 0 0 28px rgba(255, 160, 50, 0.22); } .review-example-chip:focus-visible { outline: 3px solid #ffb347; outline-offset: 3px; } .review-example-chip__g { display: flex; align-items: center; justify-content: center; width: 2.65rem; height: 2.65rem; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #fff6c2 0%, #ffc933 40%, #ff9a00 100%); box-shadow: 0 0 16px rgba(255, 200, 60, 0.55); } .review-example-chip__g .fa-google { font-size: 1.2rem; background: conic-gradient( #4285f4 0deg 90deg, #ea4335 90deg 180deg, #fbbc04 180deg 270deg, #34a853 270deg 360deg ); -webkit-background-clip: text; background-clip: text; color: transparent; } .review-example-chip__label { font-size: 0.92rem; font-weight: 800; letter-spacing: 0.02em; } .review-example-chip__action { font-size: 0.72rem; font-weight: 800; color: #ffc24a; text-transform: uppercase; letter-spacing: 0.14em; } .review-example-chip__action .fa-external-link-alt { font-size: 0.62rem; opacity: 0.9; } /* Cartões depoimento em fila (3 colunas — estilo mockup) */ .review-classic-card { display: flex; flex-direction: column; align-items: center; text-align: center; height: 100%; padding: 2rem 1.5rem 1.75rem; border-radius: 20px; background: linear-gradient(180deg, rgba(32, 18, 52, 0.95) 0%, rgba(18, 10, 34, 0.98) 100%); border: 1px solid rgba(130, 110, 170, 0.4); box-shadow: 0 10px 36px rgba(0, 0, 0, 0.35); } .review-classic-card--link { text-decoration: none; color: inherit; transition: border-color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease; } .review-classic-card--link:hover { border-color: rgba(255, 180, 100, 0.55); transform: translateY(-5px); box-shadow: 0 16px 44px rgba(0, 0, 0, 0.42); color: inherit; } .review-classic-card--link:focus-visible { outline: 3px solid #ffb347; outline-offset: 3px; } .review-classic-card__stars { margin: 0 0 1.1rem; font-size: 1.15rem; letter-spacing: 0.12em; color: #ff9d00; line-height: 1; } .review-classic-card__stars .fa-star { filter: drop-shadow(0 0 6px rgba(255, 160, 60, 0.45)); } .review-classic-card__quote { margin: 0 0 1.25rem; padding: 0; border: 0; font-size: 1.02rem; font-style: italic; font-weight: 400; line-height: 1.65; color: rgba(255, 255, 255, 0.95); max-width: 22rem; } .review-classic-card__author { margin: 0 0 0.35rem; font-size: 1.12rem; font-weight: 800; color: #ffb347; letter-spacing: 0.02em; } .review-classic-card__tenure { margin: 0 0 1rem; font-size: 0.88rem; font-weight: 500; color: rgba(255, 255, 255, 0.88); line-height: 1.4; } .review-classic-card__link { font-size: 0.85rem; font-weight: 700; color: #ffc24a !important; text-decoration: none; border-bottom: 1px solid rgba(255, 180, 80, 0.45); padding-bottom: 0.1rem; transition: color 0.2s ease, border-color 0.2s ease; } .review-classic-card__link:hover { color: #ffe9b3 !important; border-bottom-color: rgba(255, 220, 160, 0.75); } .review-classic-card__link--fake { cursor: pointer; border-bottom: 1px solid rgba(255, 180, 80, 0.45); } .review-classic-cta__title { display: flex; align-items: center; justify-content: center; gap: 0.5rem; flex-wrap: wrap; font-size: 1.35rem; font-weight: 800; color: #fff; } .review-invite-stars-wrap--compact { padding: 0.85rem 0.75rem 0.75rem; } .review-invite-stars-wrap--compact .review-invite-stars { font-size: 1.65rem; } /* Cartões de avaliações — estilo “spotlight” (dark premium / referência visual) */ .review-showcase-card { position: relative; height: 100%; display: flex; flex-direction: column; padding: 1.85rem 1.65rem 1.45rem; border-radius: 24px; background: linear-gradient(168deg, #2a183f 0%, #1a0b2e 42%, #12061c 100%); border: 1px solid rgba(255, 180, 70, 0.55); box-shadow: 0 0 0 1px rgba(255, 200, 120, 0.12) inset, 0 12px 40px rgba(0, 0, 0, 0.55), 0 0 32px rgba(255, 140, 0, 0.18), 0 0 1px rgba(255, 220, 160, 0.35); overflow: hidden; transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease; } .review-showcase-card:hover { transform: translateY(-5px); border-color: rgba(255, 210, 120, 0.75); box-shadow: 0 0 0 1px rgba(255, 220, 160, 0.18) inset, 0 20px 52px rgba(0, 0, 0, 0.58), 0 0 40px rgba(255, 160, 40, 0.28), 0 0 2px rgba(255, 230, 180, 0.45); } .review-showcase-card__deco { position: absolute; top: 0.5rem; right: 0.65rem; font-size: 3.75rem; line-height: 1; color: rgba(60, 35, 100, 0.5); pointer-events: none; z-index: 0; } .review-showcase-card__head { display: grid; grid-template-columns: 56px 1fr; grid-template-rows: auto auto; column-gap: 1rem; row-gap: 0.25rem; align-items: center; margin-bottom: 0.85rem; position: relative; z-index: 1; } .review-showcase-card__avatar { grid-column: 1; grid-row: 1 / span 2; align-self: center; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.95rem; font-weight: 800; letter-spacing: 0.04em; color: #1a0b2e; background: linear-gradient(145deg, #ffe566 0%, #ffc233 35%, #ff9d00 72%, #ff7a00 100%); box-shadow: 0 0 0 2px rgba(255, 200, 80, 0.35), 0 6px 20px rgba(255, 140, 0, 0.45); } .review-showcase-card__who { grid-column: 2; grid-row: 1 / span 2; min-width: 0; text-align: center; align-self: center; padding-top: 0; } .review-showcase-card__name { margin: 0; font-size: 1.35rem; font-weight: 800; color: #fff; line-height: 1.2; letter-spacing: 0.01em; } .review-showcase-card__meta { margin: 0.45rem 0 0; font-size: 0.8rem; color: #b3b3b3; line-height: 1.45; } .review-showcase-card__google { display: inline-flex; align-items: center; justify-content: center; width: 1.15rem; height: 1.15rem; margin-right: 0.25rem; vertical-align: -0.15em; border-radius: 3px; background: #fff; } .review-showcase-card__google .fa-google { font-size: 0.68rem; background: conic-gradient( #4285f4 0deg 90deg, #ea4335 90deg 180deg, #fbbc04 180deg 270deg, #34a853 270deg 360deg ); -webkit-background-clip: text; background-clip: text; color: transparent; } .review-showcase-card__stars { margin: 0 0 1rem; font-size: 1.25rem; letter-spacing: 0.14em; color: #ffdd55; text-align: center; position: relative; z-index: 1; } .review-showcase-card__stars .fa-star { filter: drop-shadow(0 0 14px rgba(255, 210, 80, 0.9)) drop-shadow(0 0 6px rgba(255, 140, 0, 0.65)); } .review-showcase-card__body { margin: 0; padding: 0; border: 0; flex: 1 1 auto; font-size: 1.05rem; line-height: 1.85; color: #fff; font-style: normal; font-weight: 400; white-space: pre-line; text-align: left; position: relative; z-index: 1; } .review-showcase-card__foot { margin-top: auto; padding-top: 1.15rem; width: 100%; text-align: center; position: relative; z-index: 1; } .review-showcase-card__cta-btn { display: block; width: 100%; padding: 0.95rem 1rem; border-radius: 14px; font-size: 0.88rem; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none; color: #ffc24a !important; background: linear-gradient(180deg, rgba(48, 28, 78, 0.98) 0%, rgba(22, 10, 42, 0.99) 100%); border: 2px solid rgba(255, 170, 70, 0.65); box-shadow: 0 0 24px rgba(255, 140, 0, 0.2), inset 0 1px 0 rgba(255, 200, 120, 0.08); transition: color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; } .review-showcase-card__cta-btn:hover { color: #ffe9a8 !important; border-color: rgba(255, 210, 130, 0.95); box-shadow: 0 0 32px rgba(255, 160, 50, 0.35); transform: translateY(-2px); } .review-showcase-card__cta-btn:focus-visible { outline: 3px solid #ffb347; outline-offset: 3px; } .review-showcase-card--featured .review-showcase-card__body { font-size: 1.08rem; } /* ===== [ENHANCE] MELHORIAS VISUAIS ===== */ /* 1. Grain texture — dá profundidade ao fundo escuro */ body::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9990; opacity: 0.038; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E"); background-repeat: repeat; background-size: 300px 300px; } /* 2. Navbar scroll — comprime ao scrollar */ .navbar--scrolled { padding-top: 0.55rem !important; padding-bottom: 0.55rem !important; background: rgba(10, 6, 20, 0.97) !important; backdrop-filter: blur(18px) saturate(160%) !important; box-shadow: 0 2px 16px rgba(0,0,0,0.6), 0 1px 6px rgba(255,140,0,0.18) !important; border-bottom-color: rgba(255,140,0,0.18) !important; transition: padding 0.3s ease, background 0.3s ease, box-shadow 0.3s ease !important; } .navbar--scrolled .navbar-brand img.logo { max-height: 44px !important; transition: max-height 0.3s ease; } /* 3. Scrollbar personalizada */ ::-webkit-scrollbar { width: 7px; } ::-webkit-scrollbar-track { background: #0a0612; } ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ff8c00, #e05c00); border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #ffa500, #ff6600); } /* 4. Animações escalonadas nos cards */ .fade-in:nth-child(2) { transition-delay: 0.08s !important; } .fade-in:nth-child(3) { transition-delay: 0.16s !important; } .fade-in:nth-child(4) { transition-delay: 0.24s !important; } .fade-in:nth-child(5) { transition-delay: 0.32s !important; } .fade-in:nth-child(6) { transition-delay: 0.4s !important; } /* 5. Dark red trim — acentos quentes em bordas de secção */ body[data-page="home"] .home-main > section:not(.hero):not(.home-destaques-banner) { border-left: 3px solid transparent; background-image: linear-gradient(var(--ft-page-bg), var(--ft-page-bg)), linear-gradient(180deg, rgba(139,20,20,0.25) 0%, rgba(255,140,0,0.15) 100%); background-origin: border-box; background-clip: padding-box, border-box; } /* 6. Secções internas — linha laranja subtil no topo */ .page-main section:not(#sobre-hero):not(#historia):first-of-type { border-top: 1px solid rgba(255,140,0,0.12); } /* ===== [ABOUT-STATS] Bem-vindo — cards de estatísticas ===== */ .home-about__eyebrow { font-size: 0.78rem; font-weight: 700; color: #ff8c00; text-transform: uppercase; letter-spacing: 3px; margin-bottom: 0.5rem; } .home-about__stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; } .home-about__stat { background: linear-gradient(165deg, rgba(38,22,62,0.94) 0%, rgba(24,14,46,0.96) 100%); border: 1px solid rgba(255,140,0,0.2); border-radius: 16px; padding: 1.75rem 1.25rem; text-align: center; transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease; position: relative; overflow: hidden; } .home-about__stat::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #ff8c00, #ff6600); opacity: 0; transition: opacity 0.25s ease; } @media (hover: hover) and (pointer: fine) { .home-about__stat:hover::before { opacity: 1; } .home-about__stat:hover { transform: translateY(-6px); box-shadow: 0 14px 32px rgba(255,140,0,0.22); border-color: rgba(255,140,0,0.45); } } .home-about__stat-num { display: block; font-size: 2.6rem; font-weight: 900; background: linear-gradient(135deg, #ff8c00 0%, #ff6600 50%, #ffa500 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; line-height: 1.1; margin-bottom: 0.4rem; } .home-about__stat-label { display: block; font-size: 0.83rem; color: #9a9ab0; font-weight: 500; line-height: 1.4; } .home-about__stat-icon { font-size: 2.1rem; color: #ff8c00; display: block; margin-bottom: 0.45rem; } /* ===== [PREP-BADGE] Badge e categorias de preparados ===== */ .prep-badge { display: inline-block; background: rgba(255, 140, 0, 0.15); border: 1px solid rgba(255, 140, 0, 0.4); color: #ffb257; font-size: .72rem; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; padding: .2rem .65rem; border-radius: 999px; } .prep-category__header { display: flex; align-items: center; gap: 0.55rem; padding-bottom: 0.7rem; border-bottom: 1px solid rgba(255, 140, 0, 0.22); color: #ffb257; font-weight: 700; font-size: .95rem; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 1rem; } .prep-category__header i { font-size: 1rem; opacity: .85; } .card .prep-card-img { height: 185px; } /* ===== [PROD-FILTER] Barra de filtros de produtos ===== */ .prod-filter-bar { display: flex; flex-wrap: wrap; gap: .55rem; justify-content: center; margin-bottom: 2rem; } .prod-filter-btn { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem 1.1rem; border: 2px solid rgba(255, 140, 0, 0.4); border-radius: 50px; background: rgba(255, 140, 0, 0.08); color: rgba(255, 255, 255, 0.75); font-size: .82rem; font-weight: 600; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .15s; letter-spacing: .03em; } .prod-filter-btn:hover { background: rgba(255, 140, 0, 0.18); border-color: rgba(255, 140, 0, 0.7); color: #fff; transform: translateY(-1px); } .prod-filter-btn.active { background: #ff8c00; border-color: #ff8c00; color: #fff; box-shadow: 0 4px 14px rgba(255, 140, 0, 0.4); } .prep-category--hidden { display: none !important; } /* ===== [PAY-CHIPS] Logótipos/chips de formas de pagamento ===== */ .pay-grid { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .4rem; } .pay-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .65rem; border-radius: 7px; font-size: .76rem; font-weight: 700; white-space: nowrap; letter-spacing: .02em; transition: transform .15s, box-shadow .15s; } .pay-chip:hover { transform: translateY(-1px); box-shadow: 0 3px 10px rgba(0,0,0,.3); } /* Numerário */ .pay-chip--cash { background: rgba(0, 168, 80, .14); border: 1.5px solid rgba(0, 168, 80, .4); color: #4cba78; } /* MB Way */ .pay-chip--colaboradores { padding: .28rem .55rem; background: rgba(0, 123, 59, .12); border: 1.5px solid rgba(0, 150, 72, .45); } /* Cartões (Visa/Mastercard/etc.) */ .pay-chip--cards { background: rgba(25, 80, 190, .13); border: 1.5px solid rgba(25, 80, 190, .4); color: #7aacf7; } .pay-chip--cards .fab { font-size: 1.05rem; } /* Cartões Refeição */ .pay-chip--meal { background: rgba(255, 140, 0, .11); border: 1.5px solid rgba(255, 140, 0, .4); color: #ff9a20; } /* Revolut */ .pay-chip--revolut { padding: .28rem .55rem; background: rgba(99, 91, 255, .1); border: 1.5px solid rgba(99, 91, 255, .35); } /* Transferência bancária */ .pay-chip--transfer { background: rgba(0, 160, 210, .1); border: 1.5px solid rgba(0, 160, 210, .35); color: #5bc8e8; } /* Footer — chips de pagamento */ .footer-pay-chips { margin-top: .9rem; } .footer-pay-title { font-size: .68rem; font-weight: 700; color: rgba(255, 255, 255, .4); text-transform: uppercase; letter-spacing: .07em; margin-bottom: .4rem; } .footer-pay-grid { display: flex; flex-wrap: wrap; gap: .3rem; } .footer-pay-grid .pay-chip { font-size: .7rem; padding: .22rem .55rem; } /* Cartão branco com logo real (contacto + footer) */ .pay-logo-card { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; background: #fff; border-radius: 7px; padding: .28rem .7rem; height: 36px; box-shadow: 0 2px 8px rgba(0,0,0,.25); transition: transform .15s, box-shadow .15s; } .pay-logo-card:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,.35); } .pay-logo-card__img { height: 22px; width: auto; object-fit: contain; } /* Versão menor para footer */ .footer-pay-grid .pay-logo-card { height: 28px; padding: .2rem .55rem; } .footer-pay-grid .pay-logo-card .pay-logo-card__img { height: 17px; } /* Grelha de logos no contacto */ .pay-logos-grid { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; align-items: center; } /* ===== [PARKING] Bloco de estacionamento em contacto.html ===== */ .parking-info { max-width: 720px; margin-left: auto; margin-right: auto; text-align: left; } .parking-info__title { font-size: .9rem; font-weight: 700; color: rgba(255,255,255,.75); margin-bottom: .9rem; text-align: center; } .parking-info__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .75rem; } .parking-spot { display: flex; gap: .7rem; padding: .85rem 1rem; background: rgba(255,140,0,.07); border: 1.5px solid rgba(255,140,0,.2); border-radius: 12px; transition: border-color .2s, background .2s; text-decoration: none !important; color: inherit !important; } .parking-spot--link:hover { border-color: rgba(255,140,0,.55); background: rgba(255,140,0,.13); } .parking-spot__icon { color: #ff8c00; font-size: 1.05rem; margin-top: .15rem; flex-shrink: 0; } .parking-spot strong { display: block; font-size: .82rem; font-weight: 700; color: #fff; margin-bottom: .15rem; } .parking-spot p { font-size: .76rem; color: rgba(255,255,255,.55); margin: 0; line-height: 1.4; } .parking-spot__maps { display: inline-flex; align-items: center; margin-top: .35rem; font-size: .72rem; font-weight: 600; color: #ff8c00; }