/* Theme Name: Martins e Vieira Advocacia Theme URI: https://martinsevieira.adv.br Author: Martins e Vieira Author URI: https://martinsevieira.adv.br Description: Tema moderno para escritório de advocacia Martins e Vieira Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: martinsevieira */ :root { --primary-color: #20337b; --secondary-color: #ffffff; --text-dark: #333333; --text-light: #666666; --accent-gold: #c9a961; --bg-light: #f8f9fa; } /* Modo Escuro */ body.dark-mode { --primary-color: #2d4494; --secondary-color: #1a1a1a; --text-dark: #e0e0e0; --text-light: #b0b0b0; --accent-gold: #d4b571; --bg-light: #2a2a2a; } body.dark-mode { background: #1a1a1a; color: #e0e0e0; } * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; color: var(--text-dark); line-height: 1.6; overflow-x: hidden; transition: background 0.3s ease, color 0.3s ease; } /* Header */ .site-header { background: var(--secondary-color); box-shadow: 0 2px 10px rgba(0,0,0,0.1); position: sticky; top: 0; z-index: 999; transition: all 0.3s ease; } /* Ajuste quando admin bar do WordPress está presente */ .admin-bar .site-header { top: 32px; } /* Admin bar em mobile (WordPress) */ @media screen and (max-width: 782px) { .admin-bar .site-header { top: 46px; } } body.dark-mode .site-header { background: #1f1f1f; box-shadow: 0 2px 10px rgba(0,0,0,0.3); } .header-container { max-width: 1200px; margin: 0 auto; padding: 0.8rem 2rem; display: flex; justify-content: space-between; align-items: center; position: relative; } .logo img { max-height: 65px; width: auto; transition: all 0.3s ease; } body.dark-mode .logo img { filter: brightness(0) invert(1); } .logo a { display: inline-block; line-height: 0; } /* Mobile Menu Toggle */ .mobile-menu-toggle { display: none; flex-direction: column; background: none; border: none; cursor: pointer; padding: 0.5rem; z-index: 100000; position: relative; } .mobile-menu-toggle span { width: 25px; height: 3px; background: var(--primary-color); margin: 3px 0; transition: all 0.3s ease; border-radius: 3px; } body.dark-mode .mobile-menu-toggle span { background: var(--accent-gold); } .mobile-menu-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(6px, 6px); } .mobile-menu-toggle.active span:nth-child(2) { opacity: 0; } .mobile-menu-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(6px, -6px); } /* Toggle Modo Escuro */ .theme-toggle { background: none; border: none; color: var(--primary-color); font-size: 1.3rem; cursor: pointer; padding: 0.5rem; border-radius: 50%; transition: all 0.3s; display: flex; align-items: center; justify-content: center; } .theme-toggle:hover { background: var(--bg-light); transform: rotate(20deg); } body.dark-mode .theme-toggle { color: var(--accent-gold); } .main-nav ul { display: flex; list-style: none; gap: 2rem; align-items: center; } .main-nav a { color: var(--primary-color); text-decoration: none; font-weight: 600; transition: color 0.3s; display: flex; align-items: center; gap: 0.5rem; } .main-nav a i { display: none; } .main-nav a:hover { color: var(--accent-gold); } body.dark-mode .main-nav a { color: var(--text-dark); } body.dark-mode .main-nav a:hover { color: var(--accent-gold); } /* Hero Section */ .hero-section { background: linear-gradient(135deg, var(--primary-color) 0%, #16254f 100%); color: var(--secondary-color); padding: 4rem 2rem; text-align: center; position: relative; overflow: hidden; } body.dark-mode .hero-section { background: linear-gradient(135deg, #1a2850 0%, #0d1630 100%); color: #ffffff; } .hero-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/svg+xml,'); opacity: 0.1; } .hero-content { max-width: 900px; margin: 0 auto; position: relative; z-index: 1; } .hero-logo { margin-bottom: 1.5rem; animation: fadeInDown 1s ease; } .hero-logo img { max-width: 240px; width: 100%; height: auto; filter: brightness(0) invert(1); } .hero-content h1 { font-size: 2.5rem; margin-bottom: 1rem; font-weight: 700; line-height: 1.2; animation: fadeInUp 1s ease 0.2s both; } .hero-content p { font-size: 1.1rem; margin-bottom: 1rem; opacity: 0.95; line-height: 1.6; animation: fadeInUp 1s ease 0.4s both; } .hero-subtitle { font-size: 1rem !important; font-style: italic; color: var(--accent-gold); margin-bottom: 1.5rem !important; } @keyframes fadeInDown { from { opacity: 0; transform: translateY(-30px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .cta-button { display: inline-block; background: var(--accent-gold); color: var(--secondary-color); padding: 1rem 2.5rem; border-radius: 50px; text-decoration: none; font-weight: 600; transition: all 0.3s; box-shadow: 0 4px 15px rgba(201, 169, 97, 0.3); animation: fadeInUp 1s ease 0.6s both; } .cta-button:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(201, 169, 97, 0.4); } .cta-whatsapp { background: #25D366; margin-top: 1rem; font-size: 1.1rem; } .cta-whatsapp:hover { background: #20BA5A; } .cta-whatsapp i { margin-right: 0.5rem; } /* Áreas de Atuação */ .areas-atuacao { padding: 4rem 2rem; background: var(--bg-light); } body.dark-mode .area-card { background: #252525; border-top-color: var(--accent-gold); } .section-title { text-align: center; font-size: 2.2rem; color: var(--primary-color); margin-bottom: 2.5rem; } body.dark-mode .section-title { color: var(--accent-gold); } .areas-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; } .area-card { background: var(--secondary-color); padding: 2rem; border-radius: 10px; box-shadow: 0 5px 20px rgba(0,0,0,0.08); transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); border-top: 4px solid var(--primary-color); cursor: pointer; position: relative; overflow: hidden; } .area-card::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(201, 169, 97, 0.1), transparent); transition: left 0.5s; } .area-card:hover::before { left: 100%; } .area-card:hover { transform: translateY(-15px) scale(1.02); box-shadow: 0 15px 40px rgba(32, 51, 123, 0.2); border-top-color: var(--accent-gold); } .area-card:active { transform: translateY(-12px) scale(1.01); } body.dark-mode .area-card { background: #252525; border-top: 4px solid var(--accent-gold); } body.dark-mode .area-card:hover { box-shadow: 0 15px 40px rgba(201, 169, 97, 0.3); background: #2d2d2d; } .area-card i { font-size: 2.5rem; color: var(--accent-gold); margin-bottom: 0.8rem; transition: all 0.4s ease; display: inline-block; } .area-card:hover i { transform: scale(1.2) rotate(5deg); color: var(--primary-color); } body.dark-mode .area-card:hover i { color: var(--accent-gold); text-shadow: 0 0 20px rgba(201, 169, 97, 0.5); } .area-card h3 { color: var(--primary-color); margin-bottom: 0.8rem; font-size: 1.3rem; transition: color 0.3s ease; } .area-card:hover h3 { color: var(--accent-gold); } body.dark-mode .area-card h3 { color: var(--accent-gold); border-bottom: 2px solid var(--accent-gold); padding-bottom: 0.6rem; margin-bottom: 1rem; } body.dark-mode .area-card:hover h3 { color: #ffffff; border-bottom-color: #ffffff; } .area-card p { font-size: 0.95rem; line-height: 1.5; transition: color 0.3s ease; } .area-card:hover p { color: var(--text-dark); } body.dark-mode .area-card:hover p { color: #ffffff; } /* Efeito Ripple */ .ripple-effect { position: absolute; border-radius: 50%; background: rgba(201, 169, 97, 0.4); transform: scale(0); animation: ripple-animation 0.6s ease-out; pointer-events: none; } @keyframes ripple-animation { to { transform: scale(4); opacity: 0; } } /* Sobre */ .sobre-section { padding: 4rem 2rem; background: var(--secondary-color); } body.dark-mode .sobre-section { background: #1f1f1f; } .sobre-content { max-width: 900px; margin: 0 auto; text-align: center; } .sobre-content p { font-size: 1rem; line-height: 1.7; color: var(--text-light); margin-bottom: 1rem; } /* Equipe */ .equipe-section { padding: 4rem 2rem; background: var(--bg-light); } body.dark-mode .equipe-section { background: #1a1a1a; } .equipe-grid { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 3rem; } .equipe-card { background: var(--secondary-color); border-radius: 15px; overflow: hidden; box-shadow: 0 5px 25px rgba(0,0,0,0.1); transition: all 0.4s ease; display: flex; flex-direction: column; } body.dark-mode .equipe-card { background: #252525; box-shadow: 0 5px 25px rgba(0,0,0,0.3); } .equipe-card:hover { transform: translateY(-10px); box-shadow: 0 15px 40px rgba(32, 51, 123, 0.2); } body.dark-mode .equipe-card:hover { box-shadow: 0 15px 40px rgba(201, 169, 97, 0.3); } .equipe-foto { position: relative; width: 100%; height: 350px; overflow: hidden; background: var(--bg-light); } body.dark-mode .equipe-foto { background: #1a1a1a; } .equipe-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; } .equipe-card:hover .equipe-foto img { transform: scale(1.1); } .equipe-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(135deg, rgba(32, 51, 123, 0.9) 0%, rgba(201, 169, 97, 0.9) 100%); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.4s ease; } body.dark-mode .equipe-overlay { background: linear-gradient(135deg, rgba(26, 40, 80, 0.95) 0%, rgba(212, 181, 113, 0.95) 100%); } .equipe-card:hover .equipe-overlay { opacity: 1; } .equipe-overlay i { font-size: 4rem; color: var(--secondary-color); animation: scaleIn 0.4s ease; } @keyframes scaleIn { from { transform: scale(0); } to { transform: scale(1); } } .equipe-info { padding: 2rem; text-align: center; flex: 1; display: flex; flex-direction: column; } .equipe-info h3 { color: var(--primary-color); font-size: 1.5rem; margin-bottom: 0.5rem; font-weight: 700; } body.dark-mode .equipe-info h3 { color: var(--accent-gold); } .equipe-cargo { color: var(--accent-gold); font-size: 1.1rem; font-weight: 600; margin-bottom: 0.3rem; } .equipe-oab { color: var(--primary-color); font-size: 0.95rem; font-weight: 600; margin-bottom: 1rem; padding: 0.5rem 1rem; background: var(--bg-light); border-radius: 20px; display: inline-block; } body.dark-mode .equipe-oab { color: var(--accent-gold); background: #1a1a1a; } .equipe-descricao { color: var(--text-light); font-size: 0.95rem; line-height: 1.6; margin-top: 1rem; } .equipe-social { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--bg-light); display: flex; justify-content: center; align-items: center; } body.dark-mode .equipe-social { border-top-color: #1a1a1a; } .equipe-instagram { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--secondary-color); background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); padding: 0.7rem 1.5rem; border-radius: 25px; text-decoration: none; font-weight: 600; font-size: 0.95rem; transition: all 0.3s ease; box-shadow: 0 3px 10px rgba(188, 24, 136, 0.3); } .equipe-instagram:hover { transform: translateY(-3px); box-shadow: 0 6px 15px rgba(188, 24, 136, 0.5); } .equipe-instagram i { font-size: 1.2rem; } body.dark-mode .equipe-instagram { box-shadow: 0 3px 10px rgba(188, 24, 136, 0.5); } body.dark-mode .equipe-instagram:hover { box-shadow: 0 6px 15px rgba(188, 24, 136, 0.7); } /* Blog/Posts */ .blog-section { padding: 4rem 2rem; background: var(--bg-light); } body.dark-mode .post-card { background: #252525; } body.dark-mode .post-card:hover { box-shadow: 0 10px 30px rgba(0,0,0,0.4); } .posts-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: 1.5rem; } .post-card { background: var(--secondary-color); border-radius: 10px; overflow: hidden; box-shadow: 0 5px 20px rgba(0,0,0,0.08); transition: all 0.3s; } .post-card:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.15); } .post-card img { width: 100%; height: 200px; object-fit: cover; } .post-content { padding: 1.5rem; } .post-content h3 { color: var(--primary-color); margin-bottom: 0.8rem; font-size: 1.2rem; } body.dark-mode .post-content h3 { color: var(--accent-gold); } body.dark-mode .post-content h3 a { color: var(--accent-gold); } body.dark-mode .post-content h3 a:hover { color: #ffffff; } .post-content p { color: var(--text-light); margin-bottom: 0.8rem; font-size: 0.95rem; } .read-more { color: var(--accent-gold); text-decoration: none; font-weight: 600; } /* Botão Carregar Mais Posts */ .load-more-container { text-align: center; margin-top: 3rem; padding-top: 2rem; } .load-more-btn { display: inline-flex; align-items: center; gap: 0.7rem; background: var(--accent-gold); color: var(--secondary-color); padding: 1rem 2.5rem; border: none; border-radius: 50px; font-size: 1.1rem; font-weight: 600; cursor: pointer; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(201, 169, 97, 0.3); } .load-more-btn:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(201, 169, 97, 0.4); background: var(--primary-color); } .load-more-btn:active { transform: translateY(-1px); } .load-more-btn i { font-size: 1.2rem; } .loading-spinner { color: var(--accent-gold); font-size: 1.1rem; font-weight: 600; } .loading-spinner i { margin-right: 0.5rem; font-size: 1.3rem; } body.dark-mode .load-more-btn { background: var(--accent-gold); color: #1a1a1a; } body.dark-mode .load-more-btn:hover { background: #d4b571; color: #1a1a1a; } /* Contato */ .contato-section { padding: 4rem 2rem; background: var(--primary-color); color: var(--secondary-color); } body.dark-mode .contato-section { background: #1a2850; color: #ffffff; } .contato-grid { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2.5rem; } .contato-info h3 { margin-bottom: 1.2rem; color: var(--accent-gold); font-size: 1.3rem; } .contato-info h3 i { margin-right: 0.5rem; } .contato-info p { margin-bottom: 0.8rem; font-size: 1rem; } .contato-info p i { margin-right: 0.5rem; color: var(--accent-gold); } .contato-info a { color: var(--accent-gold); text-decoration: none; transition: color 0.3s; } .contato-info a:hover { color: var(--accent-gold); } .whatsapp-link { font-weight: 600; font-size: 1.1rem; } .oab-info { color: var(--accent-gold); font-weight: 600; margin-top: 0.8rem; } /* Footer */ .site-footer { background: #0d1a3d; color: var(--secondary-color); padding: 3rem 2rem 1rem; } body.dark-mode .site-footer { background: #0a0a0a; color: #ffffff; } .footer-container { max-width: 1200px; margin: 0 auto; } .footer-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; margin-bottom: 2rem; } .footer-section h3 { color: var(--accent-gold); margin-bottom: 1rem; font-size: 1.2rem; } .footer-section p { margin-bottom: 0.8rem; font-size: 0.95rem; } .footer-section p i { margin-right: 0.5rem; color: var(--accent-gold); width: 20px; text-align: center; } .footer-section a { color: var(--accent-gold); text-decoration: none; transition: color 0.3s; } .footer-section a:hover { color: var(--accent-gold); } .footer-section .oab { color: var(--accent-gold); font-weight: 600; margin-top: 0.5rem; } .footer-whatsapp-btn { display: inline-block; background: #25D366; color: #ffffff !important; padding: 0.7rem 1.5rem; border-radius: 25px; font-weight: 600; margin-top: 1rem; transition: all 0.3s; } .footer-whatsapp-btn:hover { background: #20BA5A; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(37, 211, 102, 0.4); } .footer-whatsapp-btn i { margin-right: 0.5rem; } .footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 1.5rem; text-align: center; } .footer-bottom p { font-size: 0.9rem; opacity: 0.8; } .footer-location { margin-top: 1rem; } .footer-links { margin-top: 0.5rem; font-size: 0.85rem; } .footer-links a { color: var(--accent-gold); text-decoration: none; transition: opacity 0.3s ease; } .footer-links a:hover { opacity: 0.8; } .footer-links span { margin: 0 0.5rem; opacity: 0.5; } /* ============================================ PÁGINAS DE BLOG E POSTS ============================================ */ /* Página de Listagem de Posts (index.php) */ .blog-page { background: var(--bg-light); min-height: 100vh; } body.dark-mode .blog-page { background: #1a1a1a; } .blog-page-header { background: linear-gradient(135deg, var(--primary-color) 0%, #16254f 100%); color: var(--secondary-color); padding: 4rem 2rem; text-align: center; } body.dark-mode .blog-page-header { background: linear-gradient(135deg, #1a2850 0%, #0d1630 100%); color: #ffffff; } .blog-page-header h1 { font-size: 2.5rem; margin-bottom: 0.5rem; font-weight: 700; } body.dark-mode .blog-page-header h1 { color: var(--accent-gold); } .blog-page-header p { font-size: 1.1rem; opacity: 0.9; } .blog-container { max-width: 1200px; margin: 0 auto; padding: 3rem 2rem; } .posts-grid-archive { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 2rem; margin-bottom: 3rem; } .post-card-archive { background: var(--secondary-color); border-radius: 12px; overflow: hidden; box-shadow: 0 3px 15px rgba(0,0,0,0.08); transition: all 0.3s ease; display: flex; flex-direction: column; } body.dark-mode .post-card-archive { background: #252525; box-shadow: 0 3px 15px rgba(0,0,0,0.3); } .post-image { position: relative; overflow: hidden; height: 220px; } .post-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; } .post-card-archive:hover .post-image img { transform: scale(1.05); } .post-category-badge { position: absolute; top: 1rem; right: 1rem; background: var(--accent-gold); color: var(--secondary-color); padding: 0.4rem 1rem; border-radius: 20px; font-size: 0.85rem; font-weight: 600; } .post-category-badge a { color: var(--secondary-color); text-decoration: none; } .post-card-content { padding: 1.8rem; flex: 1; display: flex; flex-direction: column; } .post-meta-small { color: var(--text-light); font-size: 0.9rem; margin-bottom: 0.8rem; } .post-meta-small i { margin-right: 0.3rem; color: var(--accent-gold); } .post-card-title { margin-bottom: 1rem; font-size: 1.4rem; line-height: 1.3; } .post-card-title a { color: var(--primary-color); text-decoration: none; transition: color 0.3s; } .post-card-title a:hover { color: var(--accent-gold); } .post-card-title a:active { color: var(--accent-gold); } .post-excerpt { color: var(--text-light); line-height: 1.6; margin-bottom: 1.5rem; flex: 1; } .read-more-btn { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--primary-color); font-weight: 600; text-decoration: none; transition: all 0.3s; } .read-more-btn:hover { color: var(--accent-gold); gap: 0.8rem; } .no-posts { text-align: center; padding: 4rem 2rem; color: var(--text-light); } .no-posts i { font-size: 4rem; margin-bottom: 1rem; opacity: 0.3; } /* Paginação */ .pagination { grid-column: 1 / -1; display: flex; justify-content: center; gap: 0.5rem; margin-top: 2rem; } .pagination .nav-links { display: flex; gap: 0.5rem; align-items: center; } .pagination a, .pagination span { padding: 0.7rem 1.2rem; background: var(--secondary-color); color: var(--primary-color); text-decoration: none; border-radius: 5px; transition: all 0.3s; font-weight: 600; } .pagination a:hover { background: var(--primary-color); color: var(--secondary-color); } .pagination .current { background: var(--accent-gold); color: var(--secondary-color); } /* Post Individual (single.php) */ .single-post-page { background: var(--bg-light); min-height: 100vh; } body.dark-mode .single-post-page { background: #1a1a1a; } .single-article { background: var(--secondary-color); margin-bottom: 2rem; } body.dark-mode .single-article { background: #252525; } .post-featured-image { width: 100%; max-height: 500px; overflow: hidden; background: var(--primary-color); } .post-featured-image img { width: 100%; height: 100%; object-fit: cover; } .post-container { max-width: 900px; margin: 0 auto; padding: 3rem 2rem; } .post-header-single { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 2px solid var(--bg-light); } .post-meta-info { display: flex; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1.5rem; color: var(--text-light); font-size: 0.95rem; } .post-meta-info span { display: flex; align-items: center; gap: 0.4rem; } .post-meta-info i { color: var(--accent-gold); } .post-meta-info a { color: var(--text-light); text-decoration: none; transition: color 0.3s; } .post-meta-info a:hover { color: var(--primary-color); } .post-title-single { font-size: 2.5rem; color: var(--primary-color); line-height: 1.2; margin: 0; } body.dark-mode .post-title-single { color: var(--accent-gold); } .post-title-single a { color: var(--primary-color); text-decoration: none; transition: color 0.3s; } body.dark-mode .post-title-single a { color: var(--accent-gold); } .post-title-single a:hover { color: var(--accent-gold); } body.dark-mode .post-title-single a:hover { color: #ffffff; } .post-content-single { font-size: 1.1rem; line-height: 1.8; color: var(--text-dark); } .post-content-single p { margin-bottom: 1.5rem; } .post-content-single h2, .post-content-single h3, .post-content-single h4 { color: var(--primary-color); margin-top: 2rem; margin-bottom: 1rem; } body.dark-mode .post-content-single h2, body.dark-mode .post-content-single h3, body.dark-mode .post-content-single h4 { color: var(--accent-gold); } .post-content-single ul, .post-content-single ol { margin-bottom: 1.5rem; padding-left: 2rem; } .post-content-single li { margin-bottom: 0.5rem; } .post-content-single img { max-width: 100%; height: auto; border-radius: 8px; margin: 1.5rem 0; } .post-content-single blockquote { border-left: 4px solid var(--accent-gold); padding-left: 1.5rem; margin: 1.5rem 0; font-style: italic; color: var(--text-light); } .post-footer-single { margin-top: 3rem; padding-top: 2rem; border-top: 2px solid var(--bg-light); } .post-navigation { display: flex; justify-content: space-between; gap: 2rem; } .post-navigation a { color: var(--primary-color); text-decoration: none; font-weight: 600; padding: 0.8rem 1.5rem; border: 2px solid var(--primary-color); border-radius: 5px; transition: all 0.3s; display: inline-flex; align-items: center; gap: 0.5rem; } .post-navigation a:hover { background: var(--primary-color); color: var(--secondary-color); } .nav-previous a i { margin-right: 0.3rem; } .nav-next a i { margin-left: 0.3rem; } /* Responsive */ @media (max-width: 768px) { /* Header Mobile */ .header-container { flex-direction: row; justify-content: space-between; padding: 0.8rem 1.5rem; } .logo img { max-height: 55px; } .mobile-menu-toggle { display: flex !important; } /* Menu Mobile - Oculto por padrão */ .main-nav { position: fixed; top: 0; right: -100%; width: 75%; max-width: 300px; height: 100vh; background: var(--secondary-color); box-shadow: -5px 0 15px rgba(0,0,0,0.2); transition: right 0.3s ease; z-index: 99999; overflow-y: auto; } body.dark-mode .main-nav { background: #1f1f1f; box-shadow: -5px 0 15px rgba(0,0,0,0.5); } /* Menu Mobile - Ativo */ .main-nav.active { right: 0; } .main-nav ul { flex-direction: column; gap: 0; padding: 5rem 0 2rem 0; align-items: stretch; } .main-nav ul li { width: 100%; border-bottom: 1px solid rgba(0,0,0,0.05); } body.dark-mode .main-nav ul li { border-bottom-color: rgba(255,255,255,0.1); } .main-nav a { padding: 1rem 1.5rem; display: flex; align-items: center; gap: 1rem; width: 100%; font-size: 1.1rem; } .main-nav a i { display: inline-block !important; font-size: 1.2rem; width: 24px; text-align: center; } .main-nav .theme-toggle-item { margin-top: 1rem; padding: 0 1.5rem; } .main-nav .theme-toggle { width: 100%; justify-content: flex-start; padding: 1rem; border-radius: 8px; } /* Overlay quando menu está aberto */ body.menu-open::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 99998; animation: fadeIn 0.3s ease; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } /* Conteúdo da página */ .hero-content h1 { font-size: 1.8rem; } .hero-logo img { max-width: 180px; } .hero-content p { font-size: 0.95rem; } .hero-section { padding: 3rem 1.5rem; } .areas-atuacao, .sobre-section, .equipe-section, .blog-section, .contato-section { padding: 3rem 1.5rem; } .equipe-grid { grid-template-columns: 1fr; gap: 2rem; } .equipe-foto { height: 300px; } .section-title { font-size: 1.8rem; } .footer-content { grid-template-columns: 1fr; text-align: center; } } /* ============================================ PÁGINA DE POLÍTICA DE PRIVACIDADE ============================================ */ .privacy-page { background: var(--bg-light); min-height: 100vh; } body.dark-mode .privacy-page { background: #1a1a1a; } .privacy-header { background: linear-gradient(135deg, var(--primary-color) 0%, #16254f 100%); color: var(--secondary-color); padding: 4rem 2rem; text-align: center; } body.dark-mode .privacy-header { background: linear-gradient(135deg, #1a2850 0%, #0d1630 100%); color: #ffffff; } .privacy-header h1 { font-size: 2.5rem; margin-bottom: 0.5rem; font-weight: 700; } .privacy-header p { font-size: 1rem; opacity: 0.9; color: var(--accent-gold); } .privacy-container { max-width: 1000px; margin: 0 auto; padding: 3rem 2rem; } .privacy-content { background: var(--secondary-color); border-radius: 12px; padding: 3rem; box-shadow: 0 5px 20px rgba(0,0,0,0.08); } body.dark-mode .privacy-content { background: #252525; box-shadow: 0 5px 20px rgba(0,0,0,0.3); } .privacy-section { margin-bottom: 3rem; padding-bottom: 2rem; border-bottom: 2px solid var(--bg-light); } body.dark-mode .privacy-section { border-bottom-color: #1a1a1a; } .privacy-section:last-of-type { border-bottom: none; } .privacy-section h2 { color: var(--primary-color); font-size: 1.8rem; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 0.8rem; } body.dark-mode .privacy-section h2 { color: var(--accent-gold); } .privacy-section h2 i { font-size: 1.5rem; color: var(--accent-gold); } .privacy-section h3 { color: var(--primary-color); font-size: 1.3rem; margin-top: 1.5rem; margin-bottom: 1rem; } body.dark-mode .privacy-section h3 { color: var(--accent-gold); } .privacy-section p { color: var(--text-dark); line-height: 1.8; margin-bottom: 1rem; font-size: 1.05rem; } .privacy-section ul { list-style: none; padding-left: 0; margin-bottom: 1.5rem; } .privacy-section ul li { padding-left: 2rem; margin-bottom: 0.8rem; position: relative; line-height: 1.7; } .privacy-section ul li::before { content: '\f00c'; font-family: 'Font Awesome 6 Free'; font-weight: 900; position: absolute; left: 0; color: var(--accent-gold); font-size: 0.9rem; } .privacy-section a { color: var(--primary-color); text-decoration: none; font-weight: 600; transition: color 0.3s; } .privacy-section a:hover { color: var(--accent-gold); } body.dark-mode .privacy-section a { color: var(--accent-gold); } body.dark-mode .privacy-section a:hover { color: #ffffff; } .contact-box { background: var(--bg-light); padding: 2rem; border-radius: 8px; border-left: 4px solid var(--accent-gold); margin-top: 1.5rem; } body.dark-mode .contact-box { background: #1a1a1a; } .contact-box p { margin-bottom: 0.8rem; } .privacy-footer { background: var(--bg-light); padding: 2rem; border-radius: 8px; margin-top: 3rem; text-align: center; border: 2px solid var(--accent-gold); } body.dark-mode .privacy-footer { background: #1a1a1a; } .privacy-footer p { margin-bottom: 0.5rem; } .privacy-footer .update-date { font-size: 0.9rem; color: var(--text-light); font-style: italic; } /* ============================================ BANNER DE COOKIES (LGPD) ============================================ */ .cookie-banner { position: fixed; bottom: -100%; left: 0; right: 0; background: var(--secondary-color); box-shadow: 0 -5px 25px rgba(0,0,0,0.15); padding: 1.5rem 2rem; z-index: 99997; transition: bottom 0.5s ease; border-top: 4px solid var(--accent-gold); } body.dark-mode .cookie-banner { background: #1f1f1f; box-shadow: 0 -5px 25px rgba(0,0,0,0.5); } .cookie-banner.show { bottom: 0; } .cookie-content { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; } .cookie-icon { font-size: 3rem; color: var(--accent-gold); } .cookie-text { flex: 1; min-width: 300px; } .cookie-text h4 { color: var(--primary-color); margin-bottom: 0.5rem; font-size: 1.2rem; } body.dark-mode .cookie-text h4 { color: var(--accent-gold); } .cookie-text p { color: var(--text-dark); font-size: 0.95rem; line-height: 1.5; margin: 0; } .cookie-text a { color: var(--primary-color); text-decoration: underline; font-weight: 600; } .cookie-text a:hover { color: var(--accent-gold); } body.dark-mode .cookie-text a { color: var(--accent-gold); } .cookie-buttons { display: flex; gap: 1rem; flex-wrap: wrap; } .cookie-btn { padding: 0.8rem 1.8rem; border: none; border-radius: 25px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 0.5rem; font-size: 1rem; } .cookie-accept { background: var(--accent-gold); color: var(--secondary-color); box-shadow: 0 4px 12px rgba(201, 169, 97, 0.3); } .cookie-accept:hover { background: var(--primary-color); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(32, 51, 123, 0.4); } .cookie-decline { background: transparent; color: var(--text-dark); border: 2px solid var(--text-light); } .cookie-decline:hover { background: var(--bg-light); border-color: var(--primary-color); color: var(--primary-color); } body.dark-mode .cookie-decline { color: var(--text-dark); border-color: var(--text-light); } body.dark-mode .cookie-decline:hover { background: #2a2a2a; border-color: var(--accent-gold); color: var(--accent-gold); } /* Responsive - Página de Privacidade e Cookies */ @media (max-width: 768px) { .privacy-header h1 { font-size: 1.8rem; } .privacy-content { padding: 2rem 1.5rem; } .privacy-section h2 { font-size: 1.4rem; } .cookie-content { flex-direction: column; text-align: center; } .cookie-icon { font-size: 2.5rem; } .cookie-buttons { width: 100%; justify-content: center; } .cookie-btn { flex: 1; min-width: 120px; justify-content: center; } } /* Desktop - garantir que elementos mobile não apareçam */ @media (min-width: 769px) { .mobile-menu-toggle { display: none !important; } .main-nav { position: static !important; width: auto !important; height: auto !important; background: transparent !important; box-shadow: none !important; } .main-nav a i { display: none !important; } .nav-text { display: inline !important; } }