/* Shared marketing header + footer — load after tahoe-theme.css; add class "marketing-site" on */ /* Single source of truth: matches landing glass header / pill nav / mobile drawer. */ body.marketing-site { --mkt-line: rgba(255, 255, 255, 0.12); --mkt-primary: #1a73e8; } body.marketing-site header.header { position: sticky; top: 0; z-index: 200; border-bottom: 1px solid var(--mkt-line); background: rgba(9, 23, 40, 0.72) !important; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); } body.marketing-site header.header .header-top { background: transparent !important; color: rgba(238, 242, 255, 0.78) !important; border-bottom: 1px solid var(--mkt-line); padding: 5px 12px; font-size: 12px; text-align: center; } body.marketing-site header.header .header-main { padding: 0.35rem 0 0.85rem; } body.marketing-site header.header .header-main .container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; } /* Logo row above nav row (matches landing layout) */ body.marketing-site header.header .header-stack { display: flex; flex-direction: column; align-items: stretch; gap: 0.55rem; position: relative; width: 100%; } body.marketing-site header.header .header-brand-row { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; min-height: 2.35rem; } body.marketing-site header.header .logo { display: inline-flex; align-items: center; gap: 6px; font-size: 18px; font-weight: 600; color: #f1f5f9 !important; text-decoration: none; } body.marketing-site header.header .nav-toggle { display: none; background: none; border: none; color: #eef2ff; padding: 8px; border-radius: 10px; cursor: pointer; } body.marketing-site header.header .nav-toggle svg { width: 24px; height: 24px; fill: currentColor; } body.marketing-site header.header .nav-menu { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-start; gap: 0.25rem 0.5rem; list-style: none; margin: 0; padding: 0; width: 100%; } @media (min-width: 1025px) { body.marketing-site header.header .nav-menu a.cta-button, body.marketing-site header.header .nav-menu .cta-button { margin-left: auto; } } body.marketing-site header.header .nav-menu a { color: rgba(255, 255, 255, 0.9) !important; text-decoration: none; font-weight: 500; font-size: 0.9rem; padding: 0.45rem 0.65rem !important; border-radius: 999px; transition: background 0.15s ease, color 0.15s ease; } body.marketing-site header.header .nav-menu a:hover { background: rgba(255, 255, 255, 0.08) !important; color: #fff !important; } body.marketing-site header.header .nav-menu a.active { background: rgba(26, 115, 232, 0.25); color: #fff !important; } body.marketing-site header.header .nav-menu a.cta-button, body.marketing-site header.header .nav-menu .cta-button { background: var(--mkt-primary) !important; color: #fff !important; font-weight: 600; padding: 0.5rem 1rem !important; border-radius: 999px; } body.marketing-site header.header .nav-menu a.cta-button:hover, body.marketing-site header.header .nav-menu .cta-button:hover { background: #1557b0 !important; } /* Header / hamburger icon polish (same as former landing-only rules) */ body.marketing-site header.header svg { transition: filter 0.35s ease; filter: drop-shadow(0 0 1px rgba(59, 130, 246, 0.12)); } body.marketing-site header.header .nav-toggle:hover svg { filter: drop-shadow(0 0 8px rgba(147, 197, 253, 0.45)); } @media (max-width: 1024px) { body.marketing-site header.header .nav-toggle { display: flex !important; align-items: center; justify-content: center; } body.marketing-site header.header .nav-menu { display: none !important; position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; flex-direction: column !important; align-items: stretch !important; padding: 0.75rem 0 1rem !important; background: rgba(12, 18, 28, 0.97) !important; border-bottom: 1px solid var(--mkt-line) !important; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45) !important; gap: 0 !important; z-index: 220 !important; width: auto !important; } body.marketing-site header.header .nav-menu.active { display: flex !important; } body.marketing-site header.header .nav-menu a { border-radius: 0 !important; padding: 14px 1.25rem !important; border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important; } body.marketing-site header.header .nav-menu a.cta-button, body.marketing-site header.header .nav-menu .cta-button { margin: 0.5rem 1rem 0 !important; text-align: center !important; border-radius: 999px !important; border-bottom: none !important; } } @media (prefers-reduced-motion: reduce) { body.marketing-site header.header svg, body.marketing-site footer.footer .social-link svg { filter: none !important; transition: none !important; } } body.marketing-site footer.footer { border-top: 1px solid var(--mkt-line); margin-top: 2rem; padding: 2.5rem 0 0; background: rgba(0, 0, 0, 0.28); color: rgba(255, 255, 255, 0.92); } body.marketing-site footer.footer .container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; } body.marketing-site footer.footer .footer-content { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; margin-bottom: 2rem; } body.marketing-site footer.footer .footer-section h3 { color: #fff; font-size: 1.125rem; font-weight: 600; margin: 0 0 1rem; } body.marketing-site footer.footer .footer-section p { color: rgba(255, 255, 255, 0.86); font-size: 0.95rem; line-height: 1.6; margin: 0 0 0.5rem; } body.marketing-site footer.footer .footer-section ul { list-style: none; padding: 0; margin: 0; } body.marketing-site footer.footer .footer-section ul li { margin-bottom: 0.5rem; } body.marketing-site footer.footer .footer-section ul li a { color: rgba(255, 255, 255, 0.88); font-size: 0.95rem; text-decoration: none; transition: color 0.15s ease; } body.marketing-site footer.footer .footer-section ul li a:hover { color: #fff; } body.marketing-site footer.footer .footer-bottom { border-top: 1px solid var(--mkt-line); padding: 1.5rem 0; } body.marketing-site footer.footer .footer-bottom-content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; } body.marketing-site footer.footer .footer-left p { color: rgba(255, 255, 255, 0.78); font-size: 14px; margin: 0 0 0.25rem; line-height: 1.4; } body.marketing-site footer.footer .footer-left p .heart { color: #e74c3c; font-weight: bold; } body.marketing-site footer.footer .footer-links { display: flex; flex-wrap: wrap; gap: 1.5rem; } body.marketing-site footer.footer .footer-links a { color: rgba(255, 255, 255, 0.88); text-decoration: none; font-size: 14px; transition: color 0.15s ease; } body.marketing-site footer.footer .footer-links a:hover { color: #fff; } body.marketing-site footer.footer .social-links { display: flex; gap: 1rem; margin-top: 1rem; } body.marketing-site footer.footer .social-link { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.16); color: rgba(255, 255, 255, 0.92); transition: background 0.15s ease, transform 0.15s ease; } body.marketing-site footer.footer .social-link:hover { background: #1a73e8; color: #fff; transform: translateY(-2px); } body.marketing-site footer.footer .social-link svg { width: 20px; height: 20px; fill: currentColor; transition: filter 0.35s ease; filter: drop-shadow(0 0 1px rgba(59, 130, 246, 0.12)); } body.marketing-site footer.footer .social-link:hover svg { filter: drop-shadow(0 0 10px rgba(147, 197, 253, 0.5)); } @media (max-width: 768px) { body.marketing-site footer.footer .footer-bottom-content { flex-direction: column; text-align: center; } }