.protected-email {display: inline-flex;align-items: center;cursor: pointer;padding: 0.5rem 1rem;border-radius: var(--radius-md);background: rgba(0, 255, 255, 0.1);border: 1px solid transparent;transition: all var(--transition-normal);position: relative;font-family: var(--font-secondary);color: var(--cyan);text-decoration: none;user-select: none} .protected-email:hover, .protected-email.email-hover {background: rgba(0, 255, 255, 0.2);border-color: var(--cyan);box-shadow: var(--glow-cyan);transform: translateY(-2px)} .protected-email:focus {outline: none;background: rgba(0, 255, 255, 0.3);border-color: var(--cyan);box-shadow: var(--glow-cyan), 0 0 0 3px rgba(0, 255, 255, 0.3)}  .email-display {font-weight: 600;letter-spacing: 0.5px;position: relative}  .protected-email::before {content: '📧';margin-right: 0.5rem;font-size: 1.1em;opacity: 0.8;transition: opacity var(--transition-normal)} .protected-email:hover::before {opacity: 1}  .protected-email.email-revealed {background: rgba(0, 255, 0, 0.2);border-color: var(--green);box-shadow: var(--glow-green);animation: emailReveal 0.3s ease-out} .protected-email.email-revealed .email-display {color: var(--green);font-weight: 700}  @keyframes emailReveal {0% {transform: scale(1)} 50% {transform: scale(1.05)} 100% {transform: scale(1)} }  .email-link.protected-email {background: transparent;border: none;padding: 0;color: var(--cyan);text-decoration: underline;text-decoration-color: var(--cyan);text-decoration-thickness: 2px;text-underline-offset: 3px} .email-link.protected-email:hover {background: transparent;border: none;box-shadow: none;color: var(--green);text-decoration-color: var(--green);transform: none} .email-link.protected-email::before {display: none}  .email-notification {position: fixed;top: 20px;right: 20px;background: var(--bg-charcoal);color: var(--text-primary);padding: 1rem 1.5rem;border-radius: var(--radius-md);border: 1px solid var(--cyan);box-shadow: var(--glow-cyan);z-index: 10000;transform: translateX(100%);transition: transform 0.3s ease;font-family: var(--font-secondary);font-size: 0.9rem;max-width: 300px} .email-notification-success {border-color: var(--green);box-shadow: var(--glow-green)} .email-notification-error {border-color: var(--magenta);box-shadow: var(--glow-magenta)}  .faq-answer .protected-email {padding: 0.15rem 0.3rem;font-size: 0.75rem;margin: 0 0.15rem;display: inline-block;vertical-align: baseline} .faq-answer .protected-email::before {margin-right: 0.15rem;font-size: 0.8em}  @media (max-width: 768px) {.protected-email {padding: 0.75rem 1.25rem;font-size: 1.1rem} .faq-answer .protected-email {padding: 0.1rem 0.25rem;font-size: 0.7rem;margin: 0 0.1rem} .email-notification {right: 10px;left: 10px;max-width: none;transform: translateY(-100%)} .email-notification.show {transform: translateY(0)} }  @media (prefers-reduced-motion: reduce) {.protected-email {transition: none} .protected-email:hover {transform: none} @keyframes emailReveal {0%, 100% {transform: scale(1)} } }  @media (prefers-contrast: high) {.protected-email {border: 2px solid var(--cyan);background: var(--bg-dark)} .protected-email:hover {background: var(--cyan);color: var(--bg-dark)} }  @media print {.protected-email {background: none;border: 1px solid #000;color: #000;box-shadow: none} .protected-email::before {display: none} .email-notification {display: none} }  @media (prefers-color-scheme: dark) {.protected-email {background: rgba(0, 255, 255, 0.15)} .protected-email:hover {background: rgba(0, 255, 255, 0.25)} }  @media (prefers-color-scheme: light) {.protected-email {background: rgba(0, 255, 255, 0.1);color: #0066cc} .protected-email:hover {background: rgba(0, 255, 255, 0.2);color: #004499} }