<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Google Tag Manager -->
    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
    })(window,document,'script','dataLayer','GTM-WBHW7L4');</script>
    <!-- End Google Tag Manager -->
    <!-- Aladinia tracking -->
    <script src="https://aladinia.app/tracking.js?key=yb_4ce1b3b5" async></script>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preload" as="image" href="./imgs/hero-poster.jpg">
    <title>Prof. Christian Farioli | International AI Keynote Speaker, Thought Leader &amp; Author</title>
    <meta name="description" content="Book Prof. Christian Farioli, international AI keynote speaker, thought leader and bestselling author, for conferences, summits and corporate events worldwide">
    <link rel="canonical" href="https://christianfarioli.com/">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Prof. Christian Farioli — AI Strategist, Educator & Advisor">
    <meta property="og:description" content="Helping leaders navigate artificial intelligence with clarity, strategic thinking, and human-centered wisdom.">
    <meta property="og:url" content="https://christianfarioli.com/">
    <meta property="og:image" content="https://christianfarioli.com/imgs/Christian-Farioli-Speaker-on-Stage.jpg">
    <meta property="og:site_name" content="Prof. Christian Farioli">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Prof. Christian Farioli — AI Strategist, Educator & Advisor">
    <meta name="twitter:description" content="Helping leaders navigate artificial intelligence with clarity, strategic thinking, and human-centered wisdom.">
    <meta name="twitter:image" content="https://christianfarioli.com/imgs/Christian-Farioli-Speaker-on-Stage.jpg">
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"Person","@id":"https://christianfarioli.com/#christian-farioli","name":"Prof. Christian Farioli","givenName":"Christian","familyName":"Farioli","honorificPrefix":"Prof.","url":"https://christianfarioli.com/","image":"https://christianfarioli.com/images/authors/christian-farioli.jpg","jobTitle":"AI Strategist, Educator, Speaker, Author & Advisor","description":"Prof. Christian Farioli is a global AI strategist, keynote speaker, executive educator and Forbes contributor who has trained 20,000+ executives across 30+ countries and delivered 200+ keynotes on 4 continents, helping leaders navigate artificial intelligence with clarity, strategy, and human-centered wisdom.","worksFor":{"@type":"Organization","name":"Prof. Christian Farioli"},"knowsLanguage":["English","Italian"],"knowsAbout":["Artificial Intelligence","AI Strategy","AI Leadership","Generative AI","AI Search Intent Optimization","Keynote Speaking","Executive Advisory","Corporate Training","AI Literacy","Digital Marketing","Digital Transformation","Executive Education","Future of Work"],"sameAs":["https://www.linkedin.com/in/christianfarioli","https://www.facebook.com/ChrisFarioli","https://www.youtube.com/c/ChristianFarioli","https://x.com/ChrisFarioli","https://www.instagram.com/chrisfarioli","https://www.pinterest.com/christianfarioli","https://wikitia.com/wiki/Christian_Farioli","https://forbes.com.mx/author/prof-christian-farioli/"]}</script>
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"Book","name":"Pizza and A.I. - A Tasty Combo for Insightful Managers","author":{"@id":"https://christianfarioli.com/#christian-farioli"},"inLanguage":"en","about":["Artificial Intelligence","ChatGPT","Business Strategy","Management"]}</script>
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"Book","name":"The Pizza Guide to Digital Marketing","author":{"@id":"https://christianfarioli.com/#christian-farioli"},"inLanguage":"en","about":["Digital Marketing","Business Strategy"]}</script>
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"Book","name":"Disciplina per la Vita","author":[{"@id":"https://christianfarioli.com/#christian-farioli"},{"@type":"Person","name":"Bob Urichuck"}],"inLanguage":"it","about":["Personal Development","Discipline","Self-Improvement"]}</script>
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"WebSite","name":"Prof. Christian Farioli","url":"https://christianfarioli.com/","inLanguage":"en","about":{"@id":"https://christianfarioli.com/#christian-farioli"},"publisher":{"@id":"https://christianfarioli.com/#christian-farioli"}}</script>

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap" onload="this.onload=null;this.rel='stylesheet'">
    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap"></noscript>

    <style>
        /* ============================================
           CSS CUSTOM PROPERTIES
        ============================================ */
        :root {
            /* Colors */
            --color-bg-primary: #FAFAF8;
            --color-bg-secondary: #F5F4F0;
            --color-bg-dark: #1A1A1A;
            --color-text-primary: #0D0D0D;
            --color-text-secondary: #6B6B6B;
            --color-text-light: #F5F4F0;
            --color-accent: #CC0000;
            --color-accent-hover: #A30000;
            --color-border: #E8E7E3;
            --color-white: #FFFFFF;

            /* Typography */
            --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
            --font-accent: 'Playfair Display', Georgia, serif;

            /* Spacing - Refined rhythm */
            --space-xs: 8px;
            --space-sm: 16px;
            --space-md: 24px;
            --space-lg: 32px;
            --space-xl: 48px;
            --space-2xl: 64px;
            --space-3xl: 96px;
            --space-4xl: 128px;

            /* Layout */
            --max-width: 1200px;
            --nav-height: 72px;

            /* Transitions */
            --transition-fast: 200ms ease;
            --transition-base: 300ms ease;
            --transition-slow: 500ms ease;
        }

        /* ============================================
           RESET & BASE
        ============================================ */
        *, *::before, *::after {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        html {
            scroll-behavior: smooth;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        body {
            font-family: var(--font-primary);
            font-size: 17px;
            line-height: 1.7;
            color: var(--color-text-primary);
            background-color: var(--color-bg-primary);
            overflow-x: hidden;
        }

        img {
            max-width: 100%;
            height: auto;
            display: block;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        button {
            font-family: inherit;
            cursor: pointer;
            border: none;
            background: none;
        }

        /* ============================================
           TYPOGRAPHY - REFINED FOR EDITORIAL SOPHISTICATION
        ============================================ */
        h1, h2, h3, h4, h5, h6 {
            font-weight: 600;
            line-height: 1.15;
            letter-spacing: -0.025em;
        }

        .text-hero {
            font-size: clamp(36px, 4.5vw, 56px);
            line-height: 1.1;
            font-weight: 700;
            letter-spacing: -0.03em;
        }

        .text-section-title {
            font-size: clamp(30px, 3.5vw, 44px);
            line-height: 1.18;
            font-weight: 600;
            letter-spacing: -0.03em;
        }

        .text-subtitle {
            font-size: clamp(19px, 2.2vw, 22px);
            line-height: 1.5;
            font-weight: 400;
            letter-spacing: -0.01em;
        }

        .text-large {
            font-size: clamp(17px, 1.8vw, 19px);
            line-height: 1.65;
        }

        .text-body {
            font-size: 16px;
            line-height: 1.75;
        }

        .text-small {
            font-size: 13px;
            line-height: 1.55;
            font-weight: 500;
            letter-spacing: 0.01em;
        }

        .text-caption {
            font-size: 11px;
            line-height: 1.4;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.12em;
        }

        .text-accent {
            font-family: var(--font-accent);
            font-style: italic;
            font-weight: 400;
        }

        .text-center { text-align: center; }
        .text-light { color: var(--color-text-light); }
        .text-secondary { color: var(--color-text-secondary); }
        .text-accent-color { color: var(--color-accent); }

        /* ============================================
           LAYOUT
        ============================================ */
        .container {
            max-width: var(--max-width);
            margin: 0 auto;
            padding: 0 var(--space-lg);
        }

        .container-narrow {
            max-width: 800px;
            margin: 0 auto;
            padding: 0 var(--space-lg);
        }

        .section {
            padding: var(--space-3xl) 0;
        }

        .section-sm {
            padding: var(--space-2xl) 0;
        }

        .section-lg {
            padding: var(--space-4xl) 0;
        }

        /* Grid System */
        .grid {
            display: grid;
            gap: var(--space-lg);
        }

        .grid-2 { grid-template-columns: repeat(2, 1fr); }
        .grid-3 { grid-template-columns: repeat(3, 1fr); }
        .grid-4 { grid-template-columns: repeat(4, 1fr); }

        @media (max-width: 968px) {
            .grid-2, .grid-3, .grid-4 {
                grid-template-columns: 1fr;
            }
        }

        /* ============================================
           BUTTONS
        ============================================ */
        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: var(--space-xs);
            padding: 14px 28px;
            font-size: 14px;
            font-weight: 500;
            letter-spacing: 0.01em;
            border-radius: 6px;
            transition: all var(--transition-base);
            cursor: pointer;
        }

        .btn-primary {
            background: var(--color-text-primary);
            color: var(--color-white);
        }

        .btn-primary:hover {
            background: var(--color-bg-dark);
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(0,0,0,0.15);
        }

        .btn-secondary {
            background: transparent;
            color: var(--color-text-primary);
            border: 1.5px solid var(--color-text-primary);
        }

        .btn-secondary:hover {
            background: var(--color-text-primary);
            color: var(--color-white);
        }

        .btn-light {
            background: var(--color-white);
            color: var(--color-text-primary);
        }

        .btn-light:hover {
            background: var(--color-bg-secondary);
            transform: translateY(-2px);
        }

        .btn-outline-light {
            background: transparent;
            color: var(--color-white);
            border: 1.5px solid rgba(255,255,255,0.6);
        }

        .btn-outline-light:hover {
            background: var(--color-white);
            color: var(--color-text-primary);
            border-color: var(--color-white);
        }

        .btn-accent {
            background: var(--color-accent);
            color: var(--color-white);
        }

        .btn-accent:hover {
            background: var(--color-accent-hover);
            transform: translateY(-2px);
        }

        /* ============================================
           NAVIGATION - PREMIUM POLISH
        ============================================ */
        .nav {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            height: var(--nav-height);
            z-index: 1000;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.2) 100%);
        }

        .nav.scrolled {
            background: rgba(250, 250, 248, 0.95);
            backdrop-filter: blur(24px) saturate(180%);
            -webkit-backdrop-filter: blur(24px) saturate(180%);
            box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
            height: 64px;
        }

        .nav-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            height: 100%;
            padding: 0 40px;
            max-width: 1440px;
            margin: 0 auto;
        }

        .nav-logo {
            display: flex;
            align-items: center;
            transition: all 0.3s ease;
            position: relative;
            z-index: 10;
        }

        .nav-logo img {
            height: 42px;
            width: auto;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .nav-light .nav-logo img {
            /* White logo for dark hero background */
            filter: none;
        }

        .nav.scrolled .nav-logo img {
            /* Dark logo for light scrolled background */
            height: 36px;
        }

        /* Adaptive logo visibility */
        .logo-scrolled {
            display: none;
        }

        .logo-top {
            display: block;
        }

        .nav-light .logo-top {
            filter: none;
        }

        .nav.scrolled .logo-scrolled {
            display: block;
        }

        .nav.scrolled .logo-top {
            display: none;
        }

        .nav-links {
            display: flex;
            align-items: center;
            gap: 36px;
        }

        .nav-link {
            font-size: 14px;
            font-weight: 500;
            letter-spacing: 0.01em;
            color: var(--color-text-primary);
            transition: color var(--transition-fast);
            position: relative;
            padding: 8px 0;
        }

        .nav-light .nav-link {
            color: rgba(255,255,255,0.9);
        }

        .nav-link:hover {
            color: var(--color-accent);
        }

        .nav-link::after {
            content: '';
            position: absolute;
            bottom: 4px;
            left: 0;
            width: 0;
            height: 1.5px;
            background: var(--color-accent);
            transition: width var(--transition-base);
        }

        .nav-link:hover::after {
            width: 100%;
        }

        .nav-cta {
            margin-left: 8px;
            background: var(--color-accent);
            color: var(--color-white) !important;
            padding: var(--space-xs) var(--space-md);
            border-radius: 6px;
        }

        .nav-cta .btn {
            padding: 10px 20px;
            font-size: 13px;
            border-radius: 8px;
        }

        .nav-mobile-toggle {
            display: none;
            flex-direction: column;
            gap: 5px;
            padding: 8px;
            cursor: pointer;
        }

        .nav-mobile-toggle span {
            width: 22px;
            height: 2px;
            background: var(--color-text-primary);
            transition: all var(--transition-base);
            border-radius: 2px;
        }

        .nav-light .nav-mobile-toggle span {
            background: var(--color-white);
        }

        .nav.scrolled .nav-mobile-toggle span {
            background: var(--color-text-primary);
        }

        .nav-mobile-toggle.active span:nth-child(1) {
            transform: rotate(45deg) translate(5px, 5px);
        }

        .nav-mobile-toggle.active span:nth-child(2) {
            opacity: 0;
        }

        .nav-mobile-toggle.active span:nth-child(3) {
            transform: rotate(-45deg) translate(5px, -5px);
        }

        @media (max-width: 968px) {
            .nav-inner {
                padding: 0 24px;
            }

            .nav-links {
                display: none;
                position: absolute;
                top: 64px;
                left: 0;
                right: 0;
                background: rgba(250, 250, 248, 0.98);
                backdrop-filter: blur(24px);
                flex-direction: column;
                padding: 32px 24px;
                gap: 24px;
                box-shadow: 0 16px 48px rgba(0,0,0,0.12);
                border-radius: 0 0 20px 20px;
            }

            .nav-links.active { display: flex; }

            /* Mobile menu is a light panel — keep links dark/visible regardless of nav-light/scrolled */
            .nav.nav-light .nav-links .nav-link,
            .nav.scrolled .nav-links .nav-link { color: var(--color-text-primary); }
            .nav-links { background: var(--color-bg-primary); }

            .nav-mobile-toggle {
                display: flex;
            }

            .nav-cta {
                margin-left: 0;
                margin-top: 8px;
            }

            .nav-cta .btn {
                width: 100%;
                justify-content: center;
            }
        }

        /* ============================================
           HERO SECTION - REFINED COPY
        ============================================ */
        .hero {
            position: relative;
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            background: var(--color-bg-dark);
            padding-top: 72px;
        }

        .hero-video {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: calc(100% - 72px);
            margin-top: 72px;
            object-fit: cover;
            opacity: 0.35;
        }

        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: calc(100% - 72px);
            margin-top: 72px;
            background: linear-gradient(
                180deg,
                rgba(26, 26, 26, 0.4) 0%,
                rgba(26, 26, 26, 0.6) 40%,
                rgba(26, 26, 26, 0.88) 100%
            );
        }

        .hero-content {
            position: relative;
            z-index: 10;
            text-align: center;
            max-width: 780px;
            padding: 160px 40px 100px;
        }

        .hero-tagline {
            display: inline-block;
            padding: 8px 20px;
            background: rgba(204, 0, 0, 0.12);
            border: 1px solid rgba(204, 0, 0, 0.3);
            border-radius: 100px;
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.2em;
            color: #FF8080;
            margin-bottom: 40px;
        }

        .hero-title {
            color: var(--color-white);
            margin-bottom: 32px;
        }

        .hero-title span {
            display: block;
        }

        .hero-subtitle {
            font-size: clamp(16px, 1.8vw, 18px);
            color: rgba(255, 255, 255, 0.75);
            max-width: 600px;
            margin: 0 auto 48px;
            line-height: 1.7;
            letter-spacing: 0;
            font-weight: 400;
        }

        .hero-ctas {
            display: flex;
            gap: 16px;
            justify-content: center;
            flex-wrap: wrap;
        }

        .hero-scroll {
            position: absolute;
            bottom: 32px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: var(--space-sm);
            color: rgba(255, 255, 255, 0.5);
            animation: float 3s ease-in-out infinite;
            z-index: 10;
        }

        .hero-scroll-text {
            font-size: 10px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.2em;
        }

        .hero-scroll-line {
            width: 1px;
            height: 40px;
            background: linear-gradient(to bottom, rgba(255,255,255,0.5), transparent);
        }

        @keyframes float {
            0%, 100% { transform: translateX(-50%) translateY(0); }
            50% { transform: translateX(-50%) translateY(8px); }
        }

        /* ============================================
           SIGNATURE MOMENT - MANIFESTO SECTION
        ============================================ */
        .manifesto {
            background: var(--color-bg-dark);
            padding: 120px 0;
            position: relative;
            overflow: hidden;
        }

        .manifesto::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(204, 0, 0, 0.4), transparent);
        }

        .manifesto-content {
            text-align: center;
            max-width: 800px;
            margin: 0 auto;
            padding: 0 40px;
        }

        .manifesto-quote {
            font-family: var(--font-accent);
            font-size: clamp(24px, 3vw, 36px);
            font-style: italic;
            font-weight: 400;
            line-height: 1.5;
            color: var(--color-white);
            margin-bottom: 48px;
            letter-spacing: -0.01em;
        }

        .manifesto-quote em {
            color: var(--color-accent);
            font-style: normal;
        }

        .manifesto-attribution {
            font-size: 13px;
            color: rgba(255,255,255,0.45);
            letter-spacing: 0.08em;
            font-weight: 500;
        }

        .manifesto-attribution span {
            display: inline-block;
            width: 40px;
            height: 1px;
            background: rgba(255,255,255,0.25);
            margin-right: 20px;
            vertical-align: middle;
        }

        /* ============================================
           PERSONAL PHILOSOPHY SECTION
        ============================================ */
        .philosophy {
            background: var(--color-bg-secondary);
            padding: 120px 0;
        }

        .philosophy-inner {
            max-width: 720px;
            margin: 0 auto;
            text-align: center;
        }

        .philosophy-label {
            margin-bottom: 32px;
        }

        .philosophy-heading {
            font-size: clamp(28px, 3.5vw, 42px);
            line-height: 1.2;
            letter-spacing: -0.025em;
            margin-bottom: 40px;
            color: var(--color-text-primary);
        }

        .philosophy-text {
            font-size: 17px;
            line-height: 1.8;
            color: var(--color-text-secondary);
            margin-bottom: 28px;
        }

        .philosophy-signature {
            margin-top: 48px;
            padding-top: 40px;
            border-top: 1px solid var(--color-border);
        }

        .philosophy-quote-mark {
            display: block;
            font-family: var(--font-accent);
            font-size: 64px;
            color: var(--color-accent);
            line-height: 1;
            margin-bottom: 16px;
            opacity: 0.4;
        }

        .philosophy-signature em {
            font-family: var(--font-accent);
            font-size: clamp(18px, 2vw, 24px);
            font-style: italic;
            color: var(--color-text-primary);
            line-height: 1.5;
        }

        /* ============================================
           POSITIONING SECTION - ENHANCED HUMANITY
        ============================================ */
        .positioning {
            background: var(--color-bg-primary);
        }

        .positioning-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: var(--space-3xl);
            align-items: center;
        }

        .positioning-content h2 {
            margin-bottom: var(--space-lg);
            font-size: clamp(28px, 3vw, 38px);
        }

        .positioning-content > p {
            color: var(--color-text-secondary);
            margin-bottom: var(--space-md);
            font-size: 16px;
            line-height: 1.75;
        }

        .positioning-quote {
            padding: var(--space-xl);
            background: var(--color-bg-secondary);
            border-left: 3px solid var(--color-accent);
            margin: var(--space-xl) 0;
        }

        .positioning-quote blockquote {
            font-family: var(--font-accent);
            font-size: clamp(18px, 2.2vw, 22px);
            font-style: italic;
            line-height: 1.55;
            color: var(--color-text-primary);
            letter-spacing: -0.01em;
        }

        .positioning-image {
            position: relative;
        }

        .positioning-image img {
            border-radius: 12px;
            box-shadow: 0 24px 64px rgba(0,0,0,0.12);
            transition: transform var(--transition-slow);
        }

        .positioning-image:hover img {
            transform: scale(1.02);
        }

        .positioning-image-badge {
            position: absolute;
            bottom: -16px;
            right: -16px;
            background: var(--color-white);
            padding: var(--space-md) var(--space-lg);
            border-radius: 10px;
            box-shadow: 0 8px 32px rgba(0,0,0,0.1);
        }

        .positioning-image-badge span {
            display: block;
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            color: var(--color-text-secondary);
            margin-bottom: 2px;
        }

        .positioning-image-badge strong {
            font-size: 22px;
            font-weight: 700;
            color: var(--color-text-primary);
            letter-spacing: -0.02em;
        }

        @media (max-width: 968px) {
            .positioning-grid {
                grid-template-columns: 1fr;
                gap: var(--space-xl);
            }

            .positioning-image {
                order: -1;
            }
        }

        /* ============================================
           STATS SECTION - SOCIAL PROOF ENHANCED
        ============================================ */
        .stats {
            background: linear-gradient(135deg, #0f0f12 0%, #1a1a20 50%, #0f0f12 100%);
            padding: var(--space-4xl) 0;
            position: relative;
            overflow: hidden;
        }

        .stats-header {
            text-align: center;
            margin-bottom: var(--space-2xl);
        }

        .stats-header h2 {
            color: var(--color-white);
            margin-bottom: var(--space-sm);
            letter-spacing: -0.02em;
        }

        .stats-header p {
            color: rgba(255, 255, 255, 0.7);
            max-width: 640px;
            margin: 0 auto;
            font-size: 17px;
            font-weight: 400;
            line-height: 1.6;
        }

        .stats-grid {
            display: grid;
            grid-template-columns: repeat(6, 1fr);
            gap: var(--space-xl);
            position: relative;
        }

        .stat-item {
            text-align: center;
            padding: var(--space-lg) var(--space-sm);
            position: relative;
        }

        .stat-icon {
            width: 48px;
            height: 48px;
            margin: 0 auto var(--space-lg);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .stat-icon svg {
            width: 28px;
            height: 28px;
            color: var(--color-accent);
            stroke-width: 1.5;
        }

        .stat-number {
            font-size: clamp(40px, 4vw, 64px);
            font-weight: 700;
            color: var(--color-white);
            line-height: 1;
            margin-bottom: var(--space-sm);
            letter-spacing: -0.04em;
            font-variant-numeric: tabular-nums;
        }

        .stat-number span {
            color: var(--color-accent);
        }

        .stat-label {
            font-size: 12px;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: rgba(255, 255, 255, 0.5);
            line-height: 1.4;
        }

        @media (max-width: 968px) {
            .stats-grid {
                grid-template-columns: repeat(3, 1fr);
                gap: var(--space-lg);
            }
        }

        @media (max-width: 540px) {
            .stats-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: var(--space-md);
            }

            .stats-header p {
                font-size: 15px;
            }

            .stat-icon {
                width: 40px;
                height: 40px;
            }

            .stat-icon svg {
                width: 22px;
                height: 22px;
            }
        }

        /* ============================================
           SPEAKING SECTION
        ============================================ */
        .speaking {
            background: var(--color-bg-secondary);
        }

        .speaking-header {
            text-align: center;
            margin-bottom: var(--space-3xl);
        }

        .speaking-header h2 {
            margin-bottom: var(--space-sm);
        }

        .speaking-header p {
            color: var(--color-text-secondary);
            max-width: 560px;
            margin: 0 auto;
            font-size: 16px;
        }

        .speaking-grid {
            display: grid;
            grid-template-columns: 1.2fr 1fr;
            gap: var(--space-xl);
        }

        .speaking-featured {
            position: relative;
            border-radius: 16px;
            overflow: hidden;
            align-self: center;
            width: 100%;
        }

        .speaking-featured img {
            display: block;
            width: 100%;
            height: auto;
            aspect-ratio: 16 / 9;
        }

        .speaking-featured-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: var(--space-lg);
            background: linear-gradient(to top, rgba(0,0,0,0.85), transparent);
        }

        .speaking-featured-overlay h3 {
            color: var(--color-white);
            font-size: 22px;
            margin-bottom: var(--space-xs);
        }

        .speaking-featured-overlay p {
            color: rgba(255, 255, 255, 0.75);
            font-size: 14px;
        }

        .speaking-cards {
            display: flex;
            flex-direction: column;
            gap: var(--space-md);
        }

        .speaking-card {
            background: var(--color-white);
            padding: var(--space-lg);
            border-radius: 12px;
            display: flex;
            gap: var(--space-md);
            transition: all var(--transition-base);
        }

        .speaking-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 12px 40px rgba(0,0,0,0.08);
        }

        .speaking-card-icon {
            width: 48px;
            height: 48px;
            background: var(--color-bg-secondary);
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .speaking-card-icon svg {
            width: 22px;
            height: 22px;
            color: var(--color-accent);
        }

        .speaking-card h4 {
            font-size: 16px;
            margin-bottom: 4px;
        }

        .speaking-card p {
            font-size: 13px;
            color: var(--color-text-secondary);
            line-height: 1.5;
        }

        .speaking-cta {
            text-align: center;
            margin-top: var(--space-xl);
        }

        @media (max-width: 968px) {
            .speaking-grid {
                grid-template-columns: 1fr;
            }

        }

        @media (max-width: 540px) {
            .speaking-featured-overlay {
                position: static;
                padding: var(--space-md);
                background: var(--color-bg-dark);
            }
        }

        /* ============================================
           BOOKS SECTION
        ============================================ */
        .books {
            background: var(--color-bg-primary);
        }

        .books-header {
            text-align: center;
            margin-bottom: var(--space-3xl);
        }

        .books-header h2 {
            margin-bottom: var(--space-sm);
        }

        .books-grid {
            display: grid;
            grid-template-columns: 1.5fr 1fr;
            gap: var(--space-3xl);
            align-items: center;
        }

        .book-featured {
            display: flex;
            gap: var(--space-xl);
            align-items: flex-start;
        }

        .book-cover {
            flex-shrink: 0;
            width: 180px;
        }

        .book-info h3 {
            font-size: 26px;
            margin-bottom: var(--space-sm);
            letter-spacing: -0.02em;
        }

        .book-info .text-secondary {
            margin-bottom: var(--space-md);
            font-size: 14px;
        }

        .book-info > p {
            margin-bottom: var(--space-lg);
            color: var(--color-text-secondary);
            font-size: 15px;
            line-height: 1.7;
        }

        .books-list {
            display: flex;
            flex-direction: column;
            gap: var(--space-md);
        }

        .book-item {
            display: flex;
            gap: var(--space-md);
            padding: var(--space-md);
            background: var(--color-bg-secondary);
            border-radius: 12px;
        }

        .book-item-thumb {
            width: 56px;
            flex-shrink: 0;
            align-self: flex-start;
        }

        .book-item-info h4 {
            font-size: 14px;
            margin-bottom: 4px;
        }

        .book-item-info p {
            font-size: 12px;
            color: var(--color-text-secondary);
        }

        .forbes-publication {
            display: grid;
            grid-template-columns: 144px minmax(0, 1fr) auto;
            align-items: center;
            gap: var(--space-lg);
            margin-top: var(--space-xl);
            padding: var(--space-lg);
            background: var(--color-bg-secondary);
            border: 1px solid var(--color-border);
            border-radius: 12px;
            transition: border-color var(--transition-base);
        }

        .forbes-publication:hover {
            border-color: var(--color-accent);
        }

        .forbes-publication:focus-visible {
            outline: 2px solid var(--color-accent);
            outline-offset: 4px;
        }

        .forbes-publication-logo {
            display: block;
        }

        .forbes-publication-logo img {
            width: 144px;
            height: auto;
            filter: brightness(0);
        }

        .forbes-publication-copy h3 {
            margin-bottom: var(--space-xs);
            font-size: 20px;
            letter-spacing: -0.02em;
        }

        .forbes-publication-copy p {
            color: var(--color-text-secondary);
            font-size: 15px;
            line-height: 1.7;
        }

        .forbes-publication-action {
            color: var(--color-accent);
            font-size: 14px;
            font-weight: 600;
        }

        @media (max-width: 768px) {
            .forbes-publication {
                grid-template-columns: minmax(0, 1fr);
                gap: var(--space-md);
                padding: var(--space-md);
            }
        }

        @media (max-width: 968px) {
            .books-grid {
                grid-template-columns: 1fr;
            }

            .book-featured {
                flex-direction: column;
                align-items: center;
                text-align: center;
            }
        }

        /* ============================================
           INSIGHTS SECTION - MEDIA PUBLICATION FEEL
        ============================================ */
        .insights {
            background: var(--color-bg-primary);
            padding: 120px 0;
        }

        .insights-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 64px;
            flex-wrap: wrap;
            gap: 24px;
        }

        .insights-header h2 {
            margin-bottom: 0;
        }

        .insights-header p {
            font-size: 14px;
            color: var(--color-text-secondary);
            margin-top: 8px;
        }

        .insights-grid {
            display: grid;
            grid-template-columns: 1.2fr 1fr 1fr;
            gap: 32px;
        }

        .insight-card {
            background: var(--color-white);
            border-radius: 12px;
            overflow: hidden;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border: 1px solid var(--color-border);
        }

        .insight-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 24px 64px rgba(0,0,0,0.08);
            border-color: transparent;
        }

        .insight-card-image {
            height: 200px;
            overflow: hidden;
        }

        .insight-card-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .insight-card:hover .insight-card-image img {
            transform: scale(1.04);
        }

        .insight-card-content {
            padding: 28px 32px 32px;
        }

        .insight-card-category {
            display: inline-block;
            padding: 6px 14px;
            background: var(--color-bg-secondary);
            border-radius: 100px;
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            color: var(--color-accent);
            margin-bottom: 16px;
            letter-spacing: 0.08em;
        }

        .insight-card-content h3 {
            font-size: 19px;
            margin-bottom: var(--space-sm);
            line-height: 1.35;
            transition: color var(--transition-fast);
        }

        .insight-card:hover .insight-card-content h3 {
            color: var(--color-accent);
        }

        .insight-card-content > p {
            font-size: 14px;
            color: var(--color-text-secondary);
            margin-bottom: var(--space-md);
            line-height: 1.6;
        }

        .insight-card-meta {
            display: flex;
            align-items: center;
            gap: var(--space-sm);
            font-size: 12px;
            color: var(--color-text-secondary);
        }

        .insights-cta {
            text-align: center;
            margin-top: var(--space-xl);
        }

        @media (max-width: 968px) {
            .insights-grid {
                grid-template-columns: 1fr;
            }

            .insights-header {
                flex-direction: column;
                align-items: flex-start;
            }
        }

        /* ============================================
           TESTIMONIALS SECTION
        ============================================ */
        .testimonials {
            background: var(--color-bg-dark);
            padding: var(--space-4xl) 0;
        }

        .testimonials-header {
            text-align: center;
            margin-bottom: var(--space-3xl);
        }

        .testimonials-header h2 {
            color: var(--color-text-primary);
            margin-bottom: var(--space-sm);
        }

        .testimonials-header p {
            color: rgba(255, 255, 255, 0.6);
        }

        .testimonials-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: var(--space-lg);
        }

        .testimonial-card {
            background: rgba(255, 255, 255, 0.03);
            border: 1px solid rgba(255, 255, 255, 0.08);
            padding: var(--space-xl);
            border-radius: 16px;
            transition: all var(--transition-base);
        }

        .testimonial-card:hover {
            background: rgba(255, 255, 255, 0.06);
            border-color: rgba(255, 255, 255, 0.15);
        }

        .testimonial-quote {
            font-family: var(--font-accent);
            font-size: 17px;
            font-style: italic;
            line-height: 1.65;
            color: var(--color-white);
            margin-bottom: var(--space-lg);
        }

        .testimonial-author {
            display: flex;
            align-items: center;
            gap: var(--space-md);
        }

        .testimonial-avatar {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            overflow: hidden;
        }

        .testimonial-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .testimonial-info h4 {
            font-size: 14px;
            color: var(--color-white);
            margin-bottom: 2px;
        }

        .testimonial-info p {
            font-size: 12px;
            color: rgba(255, 255, 255, 0.5);
        }

        @media (max-width: 968px) {
            .testimonials-grid {
                grid-template-columns: 1fr;
            }
        }

        /* ============================================
           CTA SECTION - ENHANCED CONVERSION FLOW
        ============================================ */
        .cta {
            background: linear-gradient(135deg, var(--color-bg-secondary) 0%, var(--color-bg-primary) 100%);
            padding: var(--space-4xl) 0;
        }

        .cta-inner {
            text-align: center;
            max-width: 760px;
            margin: 0 auto;
        }

        .cta-inner h2 {
            margin-bottom: var(--space-sm);
        }

        .cta-inner > p {
            font-size: 18px;
            color: var(--color-text-secondary);
            margin-bottom: var(--space-xl);
            line-height: 1.6;
        }

        .cta-buttons {
            display: flex;
            gap: var(--space-sm);
            justify-content: center;
            flex-wrap: wrap;
            margin-bottom: var(--space-xl);
        }

        .cta-options {
            display: flex;
            gap: var(--space-lg);
            justify-content: center;
            flex-wrap: wrap;
        }

        .cta-option {
            display: flex;
            align-items: center;
            gap: var(--space-sm);
            padding: var(--space-sm) var(--space-md);
            background: var(--color-white);
            border-radius: 8px;
            font-size: 13px;
            font-weight: 500;
            color: var(--color-text-primary);
            transition: all var(--transition-fast);
        }

        .cta-option:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.08);
        }

        .cta-option svg {
            width: 16px;
            height: 16px;
            color: var(--color-accent);
        }

        /* ============================================
           FOOTER - PREMIUM EDITORIAL
        ============================================ */
        .footer {
            background: var(--color-bg-dark);
            padding: 100px 0 60px;
        }

        .footer-top {
            display: grid;
            grid-template-columns: 1.4fr 1fr 1fr 1fr;
            gap: 48px;
            padding-bottom: 80px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.06);
            margin-bottom: 48px;
        }

        .footer-brand {
            max-width: 340px;
        }

        .footer-brand img {
            height: 36px;
            width: auto;
            margin-bottom: 24px;
            filter: none;
            opacity: 0.9;
        }

        .footer-brand p {
            color: rgba(255, 255, 255, 0.5);
            font-size: 15px;
            line-height: 1.75;
            margin-bottom: 32px;
            font-weight: 400;
        }

        .footer-social {
            display: flex;
            gap: 16px;
        }

        .footer-social a {
            width: 42px;
            height: 42px;
            border: 1px solid rgba(255, 255, 255, 0.12);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
        }

        .footer-social a:hover {
            background: var(--color-white);
            border-color: var(--color-white);
            transform: translateY(-2px);
        }

        .footer-social a:hover svg {
            color: var(--color-text-primary);
        }

        .footer-social svg {
            width: 16px;
            height: 16px;
            color: rgba(255, 255, 255, 0.6);
            transition: color 0.3s ease;
        }

        .footer-links h4 {
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: rgba(255, 255, 255, 0.4);
            margin-bottom: 24px;
        }

        .footer-links ul {
            list-style: none;
        }

        .footer-links li {
            margin-bottom: 14px;
        }

        .footer-links a {
            font-size: 14px;
            color: rgba(255, 255, 255, 0.65);
            transition: color 0.3s ease;
            font-weight: 400;
        }

        .footer-links a:hover {
            color: var(--color-white);
        }

        .footer-newsletter h4 {
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: rgba(255, 255, 255, 0.4);
            margin-bottom: 20px;
        }

        .footer-newsletter p {
            font-size: 14px;
            color: rgba(255, 255, 255, 0.5);
            margin-bottom: 24px;
            line-height: 1.7;
        }

        .footer-newsletter-form {
            display: flex;
            gap: 12px;
        }

        .footer-newsletter-form input {
            flex: 1;
            padding: 14px 18px;
            background: rgba(255, 255, 255, 0.06);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 8px;
            font-size: 14px;
            color: var(--color-white);
            outline: none;
            transition: all 0.3s ease;
        }

        .footer-newsletter-form input::placeholder {
            color: rgba(255, 255, 255, 0.35);
        }

        .footer-newsletter-form input:focus {
            border-color: rgba(255, 255, 255, 0.3);
            background: rgba(255, 255, 255, 0.1);
        }

        .footer-newsletter-form button {
            padding: 14px 22px;
            background: var(--color-accent);
            color: var(--color-white);
            border-radius: 8px;
            font-size: 13px;
            font-weight: 600;
            transition: all 0.3s ease;
            letter-spacing: 0.02em;
        }

        .footer-newsletter-form button:hover {
            background: var(--color-accent-hover);
            transform: translateY(-1px);
        }

        .footer-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 24px;
            padding-top: 40px;
        }

        .footer-copyright {
            font-size: 13px;
            color: rgba(255, 255, 255, 0.35);
            font-weight: 400;
        }

        .footer-legal {
            display: flex;
            gap: 32px;
        }

        .footer-legal a {
            font-size: 13px;
            color: rgba(255, 255, 255, 0.35);
            transition: color 0.3s ease;
        }

        .footer-legal a:hover {
            color: rgba(255, 255, 255, 0.7);
        }

        @media (max-width: 968px) {
            .footer-top {
                grid-template-columns: 1fr 1fr;
                gap: 40px;
            }

            .footer-brand {
                grid-column: span 2;
            }
        }

        @media (max-width: 540px) {
            .footer-top {
                grid-template-columns: 1fr;
            }

            .footer-brand {
                grid-column: span 1;
            }

            .footer-bottom {
                flex-direction: column;
                align-items: flex-start;
            }
        }

        /* ============================================
           ANIMATIONS
        ============================================ */

        /* Premium Easing Curves */
        :root {
            --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
            --ease-out-quint: cubic-bezier(0.22, 1, 0.36, 1);
            --ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
            --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
            --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
        }

        .fade-up {
            opacity: 0;
            transform: translateY(40px);
            transition: opacity 1s var(--ease-out-quint), transform 1s var(--ease-out-quint);
        }

        .fade-up.visible {
            opacity: 1;
            transform: translateY(0);
        }

        /* Scale Fade - for smaller elements */
        .fade-scale {
            opacity: 0;
            transform: scale(0.95);
            transition: opacity 0.8s var(--ease-out-quint), transform 0.8s var(--ease-out-quint);
        }

        .fade-scale.visible {
            opacity: 1;
            transform: scale(1);
        }

        /* Slide In From Left */
        .slide-in-left {
            opacity: 0;
            transform: translateX(-60px);
            transition: opacity 1s var(--ease-out-quint), transform 1s var(--ease-out-quint);
        }

        .slide-in-left.visible {
            opacity: 1;
            transform: translateX(0);
        }

        /* Slide In From Right */
        .slide-in-right {
            opacity: 0;
            transform: translateX(60px);
            transition: opacity 1s var(--ease-out-quint), transform 1s var(--ease-out-quint);
        }

        .slide-in-right.visible {
            opacity: 1;
            transform: translateX(0);
        }

        /* Blur In - Apple style blur transition */
        .blur-in {
            opacity: 0;
            filter: blur(20px);
            transform: translateY(30px);
            transition: opacity 1.2s var(--ease-out-expo), filter 1.2s var(--ease-out-expo), transform 1.2s var(--ease-out-expo);
        }

        .blur-in.visible {
            opacity: 1;
            filter: blur(0);
            transform: translateY(0);
        }

        .stagger-1 { transition-delay: 0.1s; }
        .stagger-2 { transition-delay: 0.2s; }
        .stagger-3 { transition-delay: 0.3s; }
        .stagger-4 { transition-delay: 0.4s; }
        .stagger-5 { transition-delay: 0.5s; }
        .stagger-6 { transition-delay: 0.6s; }
        .stagger-7 { transition-delay: 0.7s; }
        .stagger-8 { transition-delay: 0.8s; }

        /* ============================================
           MICRO-INTERACTIONS
        ============================================ */

        /* Premium Button Interactions */
        .btn {
            position: relative;
            overflow: hidden;
            transform: translateZ(0);
            transition: all 0.4s var(--ease-out-quint);
        }

        .btn::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            background: rgba(255, 255, 255, 0.15);
            border-radius: 50%;
            transform: translate(-50%, -50%);
            transition: width 0.6s var(--ease-out-quint), height 0.6s var(--ease-out-quint);
        }

        .btn:hover::before {
            width: 300%;
            height: 300%;
        }

        .btn:active {
            transform: scale(0.97) translateZ(0);
            transition-duration: 0.1s;
        }

        /* Button Shine Effect */
        .btn-primary {
            background: var(--color-text-primary);
            background-size: 200% 200%;
            transition: all 0.5s var(--ease-out-quint), background-position 0.5s var(--ease-out-quint);
        }

        .btn-primary:hover {
            background-position: 100% 100%;
            box-shadow: 0 8px 32px rgba(74, 74, 116, 0.35), 0 2px 8px rgba(0, 0, 0, 0.1);
            transform: translateY(-2px);
        }

        .btn-secondary {
            background: transparent;
            border: 1.5px solid var(--color-text);
            transition: all 0.4s var(--ease-out-quint);
        }

        .btn-secondary:hover {
            background: var(--color-text);
            color: var(--color-bg);
            transform: translateY(-2px);
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
        }

        .btn-light {
            background: rgba(255, 255, 255, 0.95);
            color: var(--color-text);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            transition: all 0.4s var(--ease-out-quint);
        }

        .btn-light:hover {
            background: #fff;
            transform: translateY(-2px);
            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
        }

        .btn-outline-light {
            border: 1.5px solid rgba(255, 255, 255, 0.8);
            color: #fff;
            background: transparent;
            transition: all 0.4s var(--ease-out-quint);
        }

        .btn-outline-light:hover {
            background: rgba(255, 255, 255, 0.15);
            border-color: #fff;
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
        }

        /* ============================================
           NAVIGATION PREMIUM INTERACTIONS
        ============================================ */
        .nav {
            transform: translateY(0);
            transition: all 0.5s var(--ease-out-quint);
        }

        .nav.hidden {
            transform: translateY(0);
        }

        .nav-link {
            position: relative;
            transition: all 0.3s var(--ease-out-quint);
        }

        .nav-link::after {
            content: '';
            position: absolute;
            bottom: -4px;
            left: 0;
            width: 0;
            height: 1.5px;
            background: currentColor;
            transition: width 0.4s var(--ease-out-quint);
        }

        .nav-link:hover::after {
            width: 100%;
        }

        .nav-cta {
            transition: all 0.3s var(--ease-out-quint) !important;
        }

        .nav-cta:hover {
            transform: scale(1.02);
            background: var(--color-accent-hover);
        }

        /* Mobile Nav Toggle Animation */
        .nav-mobile-toggle {
            transition: all 0.3s var(--ease-out-quint);
        }

        .nav-mobile-toggle:hover {
            transform: scale(1.1);
        }

        .nav-mobile-toggle span {
            transition: all 0.4s var(--ease-out-quint);
        }

        /* ============================================
           CARD MICRO-INTERACTIONS
        ============================================ */
        .insight-card {
            transition: all 0.5s var(--ease-out-quint);
            transform: translateZ(0);
        }

        .insight-card:hover {
            transform: translateY(-8px) translateZ(0);
            box-shadow: 0 24px 48px rgba(0, 0, 0, 0.12);
        }

        .insight-card-image img {
            transition: transform 0.8s var(--ease-out-quint);
        }

        .insight-card:hover .insight-card-image img {
            transform: scale(1.05);
        }

        .speaking-card {
            transition: all 0.4s var(--ease-out-quint);
            transform: translateZ(0);
        }

        .speaking-card:hover {
            transform: translateY(-4px) translateZ(0);
            box-shadow: 0 16px 32px rgba(0, 0, 0, 0.08);
        }

        .speaking-card-icon {
            transition: all 0.4s var(--ease-out-quint);
        }

        .speaking-card:hover .speaking-card-icon {
            transform: scale(1.1);
        }

        .testimonial-card {
            transition: all 0.5s var(--ease-out-quint);
        }

        .testimonial-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        }

        /* ============================================
           TYPOGRAPHY ANIMATIONS
        ============================================ */
        .hero-title {
            overflow: hidden;
        }

        .hero-title .word {
            display: inline-block;
            animation: word-reveal 1.2s var(--ease-out-quint) forwards;
            animation-delay: calc(var(--index) * 0.15s);
            opacity: 0;
            transform: translateY(100%);
        }

        @keyframes word-reveal {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* Letter Animation for Special Headings */
        .text-animate {
            display: inline-block;
            opacity: 0;
            transform: translateY(20px) rotateX(-40deg);
            animation: letter-unfold 0.8s var(--ease-out-quint) forwards;
            animation-delay: calc(var(--index) * 0.05s);
        }

        @keyframes letter-unfold {
            to {
                opacity: 1;
                transform: translateY(0) rotateX(0);
            }
        }

        /* Gradient Text Animation */
        .text-gradient-animate {
            background: linear-gradient(
                90deg,
                var(--color-text) 0%,
                var(--color-primary) 50%,
                var(--color-text) 100%
            );
            background-size: 200% 100%;
            -webkit-background-clip: text;
            background-clip: text;
            animation: gradient-shift 4s ease-in-out infinite;
        }

        @keyframes gradient-shift {
            0%, 100% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
        }

        /* ============================================
           ATMOSPHERIC MOTION
        ============================================ */

        /* Floating Elements */
        .float {
            animation: float 6s ease-in-out infinite;
        }

        .float-slow {
            animation: float 8s ease-in-out infinite;
        }

        .float-fast {
            animation: float 4s ease-in-out infinite;
        }

        @keyframes float {
            0%, 100% { transform: translateY(0px); }
            50% { transform: translateY(-15px); }
        }

        /* Subtle Pulse */
        .pulse-subtle {
            animation: pulse-subtle 3s ease-in-out infinite;
        }

        @keyframes pulse-subtle {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.7; }
        }

        /* Parallax Effect Base */
        .parallax-element {
            will-change: transform;
            transition: transform 0.1s linear;
        }

        /* Hero Scroll Line Animation */
        .hero-scroll-line {
            height: 0;
            animation: scroll-line-grow 2s var(--ease-out-quint) infinite;
            animation-delay: 1s;
        }

        @keyframes scroll-line-grow {
            0% { height: 0; opacity: 0; }
            50% { height: 60px; opacity: 1; }
            100% { height: 0; opacity: 0; transform: translateY(40px); }
        }

        /* Hero Content Reveal Animation */
        .hero-content .hero-tagline {
            opacity: 0;
            transform: translateY(20px);
            animation: hero-reveal 0.8s var(--ease-out-quint) forwards;
            animation-delay: 0.5s;
        }

        .hero-content .hero-title {
            opacity: 0;
            transform: translateY(30px);
            animation: hero-reveal 1s var(--ease-out-quint) forwards;
            animation-delay: 0.7s;
        }

        .hero-content .hero-subtitle {
            opacity: 0;
            transform: translateY(20px);
            animation: hero-reveal 1s var(--ease-out-quint) forwards;
            animation-delay: 0.9s;
        }

        .hero-content .hero-ctas {
            opacity: 0;
            transform: translateY(20px);
            animation: hero-reveal 1s var(--ease-out-quint) forwards;
            animation-delay: 1.1s;
        }

        @keyframes hero-reveal {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        /* ============================================
           IMAGE HOVER EFFECTS
        ============================================ */
        .positioning-image img {
            transition: transform 0.8s var(--ease-out-quint);
        }

        .positioning-image:hover img {
            transform: scale(1.03);
        }

        /* ============================================
           FOOTER LINK HOVER
        ============================================ */
        .footer-links a {
            position: relative;
            transition: all 0.3s var(--ease-out-quint);
        }

        .footer-links a::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0;
            width: 0;
            height: 1px;
            background: currentColor;
            transition: width 0.3s var(--ease-out-quint);
        }

        .footer-links a:hover::after {
            width: 100%;
        }

        .footer-social a {
            transition: all 0.4s var(--ease-out-quint);
        }

        .footer-social a:hover {
            transform: translateY(-3px) scale(1.1);
        }

        /* ============================================
           SCROLL PROGRESS INDICATOR
        ============================================ */
        .scroll-progress {
            position: fixed;
            top: 0;
            left: 0;
            height: 2px;
            background: linear-gradient(90deg, var(--color-primary), var(--color-text));
            transform-origin: left;
            transform: scaleX(0);
            z-index: 1001;
            transition: transform 0.1s linear;
        }

        /* ============================================
           PAGE LOADING ANIMATION
        ============================================ */
        .page-loader {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: var(--color-bg);
            z-index: 10000;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: opacity 0.6s var(--ease-out-quint), visibility 0.6s;
        }

        .page-loader.loaded {
            opacity: 0;
            visibility: hidden;
        }

        .loader-content {
            text-align: center;
        }

        .loader-logo {
            width: 60px;
            height: 60px;
            animation: loader-pulse 1.5s ease-in-out infinite;
        }

        @keyframes loader-pulse {
            0%, 100% { transform: scale(1); opacity: 1; }
            50% { transform: scale(1.1); opacity: 0.8; }
        }

        .loader-bar {
            width: 120px;
            height: 2px;
            background: rgba(0, 0, 0, 0.1);
            margin: 24px auto 0;
            overflow: hidden;
            border-radius: 1px;
        }

        .loader-bar-fill {
            height: 100%;
            background: var(--color-primary);
            width: 0;
            animation: loader-fill 1.5s var(--ease-out-quint) forwards;
        }

        @keyframes loader-fill {
            to { width: 100%; }
        }

        /* ============================================
           LINK UNDERLINE ANIMATION
        ============================================ */
        .link-underline {
            position: relative;
            display: inline-block;
        }

        .link-underline::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
            background: currentColor;
            transform: scaleX(0);
            transform-origin: right;
            transition: transform 0.4s var(--ease-out-quint);
        }

        .link-underline:hover::after {
            transform: scaleX(1);
            transform-origin: left;
        }

        /* ============================================
           CTA SECTION ANIMATION
        ============================================ */
        .cta-option {
            transition: all 0.4s var(--ease-out-quint);
        }

        .cta-option:hover {
            transform: translateY(-4px);
            color: var(--color-text);
        }

        .cta-option svg {
            transition: transform 0.4s var(--ease-out-quint);
        }

        .cta-option:hover svg {
            transform: scale(1.15);
        }

        /* ============================================
           MANIFESTO QUOTE ANIMATION
        ============================================ */
        .manifesto-quote {
            opacity: 0;
            transform: translateY(30px);
            animation: manifesto-reveal 1.2s var(--ease-out-quint) forwards;
            animation-delay: 0.3s;
        }

        @keyframes manifesto-reveal {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .manifesto-attribution {
            opacity: 0;
            animation: manifesto-reveal 1s var(--ease-out-quint) forwards;
            animation-delay: 0.8s;
        }

        /* ============================================
           TESTIMONIALS SECTION - PREMIUM CAROUSEL
        ============================================ */
        .testimonials-section {
            background: var(--color-bg-primary);
            padding: var(--space-4xl) 0;
            position: relative;
            overflow: hidden;
        }

        .testimonials-header {
            text-align: center;
            margin-bottom: var(--space-3xl);
        }

        .testimonials-label {
            display: inline-block;
            font-size: 12px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.15em;
            color: var(--color-accent);
            margin-bottom: var(--space-md);
        }

        .testimonials-header h2 {
            font-family: var(--font-accent);
            font-size: clamp(32px, 4vw, 48px);
            font-weight: 500;
            letter-spacing: -0.02em;
            margin-bottom: var(--space-sm);
        }

        .testimonials-header p {
            color: var(--color-text-secondary);
            font-size: 17px;
            max-width: 560px;
            margin: 0 auto;
        }

        /* Testimonial Carousel */
        .testimonial-carousel {
            max-width: 800px;
            margin: 0 auto;
            position: relative;
        }

        .testimonial-track {
            position: relative;
            display: grid;
        }

        .testimonial-slide {
            grid-column: 1;
            grid-row: 1;
            opacity: 0;
            transform: translateY(20px);
            transition: all 0.8s var(--ease-out-quint);
            pointer-events: none;
        }

        .testimonial-slide.active {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }

        .testimonial-quote-large {
            background: var(--color-white);
            border-radius: 20px;
            padding: var(--space-2xl);
            text-align: center;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
            border: 1px solid var(--color-border);
        }

        .quote-icon {
            width: 40px;
            height: 40px;
            color: var(--color-accent);
            opacity: 0.3;
            margin-bottom: var(--space-md);
        }

        .testimonial-quote-large p {
            font-family: var(--font-accent);
            font-size: clamp(20px, 2.5vw, 26px);
            line-height: 1.6;
            color: var(--color-text-primary);
            font-style: italic;
            margin-bottom: var(--space-xl);
        }

        .testimonial-author-carousel {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: var(--space-lg);
            padding-top: var(--space-lg);
            border-top: 1px solid var(--color-border);
        }

        .author-avatar {
            width: 56px;
            height: 56px;
            border-radius: 50%;
            overflow: hidden;
            flex-shrink: 0;
            background: var(--color-bg-secondary);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .author-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .author-initials {
            font-size: 16px;
            font-weight: 700;
            color: var(--color-text-primary);
            text-transform: uppercase;
            letter-spacing: -0.02em;
        }

        .author-info h4 {
            font-size: 16px;
            font-weight: 600;
            color: var(--color-text-primary);
            margin-bottom: 2px;
        }

        .author-info p {
            font-size: 14px;
            color: var(--color-text-secondary);
        }

        .company-logo {
            padding: 6px 14px;
            background: var(--color-bg-secondary);
            border-radius: 100px;
            font-size: 12px;
            font-weight: 600;
            color: var(--color-text-secondary);
        }

        /* Carousel Navigation */
        .carousel-nav {
            display: flex;
            justify-content: center;
            gap: var(--space-sm);
            margin-top: var(--space-xl);
        }

        .carousel-dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: var(--color-border);
            border: none;
            cursor: pointer;
            transition: all 0.3s var(--ease-out-quint);
        }

        .carousel-dot.active {
            background: var(--color-accent);
            transform: scale(1.3);
        }

        .carousel-dot:hover {
            background: var(--color-text-secondary);
        }

        /* Testimonials Footer */
        .testimonials-footer {
            text-align: center;
            margin-top: var(--space-2xl);
        }

        .view-all-link {
            display: inline-flex;
            align-items: center;
            gap: var(--space-xs);
            color: var(--color-text-primary);
            text-decoration: none;
            font-weight: 600;
            font-size: 15px;
            transition: all 0.3s var(--ease-out-quint);
        }

        .view-all-link svg {
            width: 20px;
            height: 20px;
            transition: transform 0.3s var(--ease-out-quint);
        }

        .view-all-link:hover {
            color: var(--color-accent);
        }

        .view-all-link:hover svg {
            transform: translateX(4px);
        }

        @media (max-width: 768px) {
            .testimonial-quote-large {
                padding: var(--space-xl);
            }

            .testimonial-author-carousel {
                flex-direction: column;
                text-align: center;
            }

            .company-logo {
                margin-top: var(--space-sm);
            }
        }

        /* ============================================
           REDUCED MOTION
        ============================================ */
        @media (prefers-reduced-motion: reduce) {
            *,
            *::before,
            *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
            }

            .float, .float-slow, .float-fast,
            .pulse-subtle, .hero-scroll-line {
                animation: none;
            }
        }

        /* ============================================
           UTILITY CLASSES
        ============================================ */
        .mt-sm { margin-top: var(--space-sm); }
        .mt-md { margin-top: var(--space-md); }
        .mt-lg { margin-top: var(--space-lg); }
        .mt-xl { margin-top: var(--space-xl); }
        .mt-2xl { margin-top: var(--space-2xl); }

        .mb-sm { margin-bottom: var(--space-sm); }
        .mb-md { margin-bottom: var(--space-md); }
        .mb-lg { margin-bottom: var(--space-lg); }
        .mb-xl { margin-bottom: var(--space-xl); }
        .mb-2xl { margin-bottom: var(--space-2xl); }

        .bg-dark { background: var(--color-bg-dark); }
        .bg-secondary { background: var(--color-bg-secondary); }
            /* Mobile horizontal-overflow fix */
        html { overflow-x: hidden; width: 100%; }
        @media (max-width: 768px) {
            .slide-in-left, .slide-in-right { transform: translateY(24px); }
            .slide-in-left.visible, .slide-in-right.visible { transform: translateY(0); }
        }
            /* Past Events preview (in Speaking section) */
        .events-preview { margin-top: var(--space-2xl); text-align: center; }
        .events-preview-stats { display: flex; justify-content: center; gap: var(--space-2xl); flex-wrap: wrap; margin-bottom: var(--space-xl); }
        .events-preview-stats div { display: flex; flex-direction: column; }
        .events-preview-stats strong { font-size: clamp(28px, 3vw, 40px); font-weight: 700; color: var(--color-accent); line-height: 1; }
        .events-preview-stats span { font-size: 13px; color: var(--color-text-secondary); margin-top: 6px; letter-spacing: 0.03em; }
        .events-preview-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: var(--space-lg); }
        .events-preview-item { position: relative; display: block; border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--color-bg-secondary); }
        .events-preview-caption { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 12px 10px; font-size: 12px; font-weight: 600; line-height: 1.25; color: #fff; text-align: left; background: linear-gradient(to top, rgba(0,0,0,0.82), rgba(0,0,0,0.35) 60%, transparent); opacity: 0; transition: opacity .3s ease; }
        .events-preview-item:hover .events-preview-caption { opacity: 1; }
        @media (max-width: 768px) { .events-preview-caption { opacity: 1; font-size: 11px; padding: 18px 9px 8px; } }
        .events-preview-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
        .events-preview-item:hover img { transform: scale(1.06); }
        .events-preview-more { margin-top: var(--space-sm); }
        @media (max-width: 768px) { .events-preview-grid { grid-template-columns: repeat(2, 1fr); } .events-preview-stats { gap: var(--space-lg); } }
            /* Speaking nav dropdown */
        .nav-dropdown { position: relative; display: inline-flex; align-items: center; }
        .nav-dropdown-menu { position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%) translateY(6px); min-width: 168px; background: var(--color-white); border: 1px solid rgba(0,0,0,0.08); border-radius: 10px; box-shadow: 0 14px 36px rgba(0,0,0,0.12); padding: 6px; opacity: 0; visibility: hidden; transition: opacity .25s ease, transform .25s ease; z-index: 200; }
        .nav-dropdown::after { content: ''; position: absolute; top: 100%; left: 0; right: 0; height: 14px; }
        .nav-dropdown:hover .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
        .nav-dropdown-menu a { display: block; padding: 9px 14px; font-size: 14px; font-weight: 500; color: var(--color-text-primary); text-decoration: none; border-radius: 6px; white-space: nowrap; }
        .nav-dropdown-menu a:hover { background: var(--color-bg-secondary); color: var(--color-accent); }
        @media (max-width: 968px) { .nav-dropdown { flex-direction: column; align-items: center; gap: 24px; width: 100%; } .nav-dropdown-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none; background: transparent; padding: 0; min-width: 0; width: 100%; text-align: center; } .nav-dropdown-menu a { display: block; width: 100%; padding: 8px 0; font-size: 14px; font-weight: 500; color: var(--color-text-primary); text-align: center; background: transparent; border-radius: 0; } .nav-dropdown-menu a:hover { background: transparent; color: var(--color-accent); } .nav-dropdown::after { display: none; } }
            /* Trusted-by client strip */
        .trusted-strip { padding: var(--space-2xl) 0; background: var(--color-bg-secondary); text-align: center; }
        .trusted-label { font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-text-secondary); margin-bottom: var(--space-lg); }
        .trusted-link { font-size: 14px; font-weight: 600; color: var(--color-accent); text-decoration: none; }
        .trusted-link:hover { text-decoration: underline; }
        

        /* Landscape stage photo: styles limited to the positioning section. */
        #positioning .positioning-grid {
            grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
            gap: 40px 48px;
            align-items: center;
        }

        #positioning .positioning-content > p:last-of-type {
            margin-bottom: 0;
        }

        #positioning .positioning-image img {
            display: block;
            width: 100%;
            height: auto;
            aspect-ratio: 3 / 2;
            box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
            transform: none;
        }

        #positioning .positioning-image-badge {
            position: static;
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 8px 20px;
            margin-top: 16px;
            padding: 18px 24px;
            border: 1px solid var(--color-border);
            box-shadow: none;
        }

        #positioning .positioning-image-badge span {
            margin-bottom: 0;
        }

        #positioning .positioning-quote {
            grid-column: 1 / -1;
            margin: 0;
            padding: 28px 32px;
        }

        @media (max-width: 968px) {
            #positioning .positioning-grid {
                grid-template-columns: minmax(0, 1fr);
                gap: 32px;
            }
        }

        @media (max-width: 540px) {
            #positioning {
                padding-top: 64px;
                padding-bottom: 64px;
            }

            #positioning .positioning-image-badge {
                padding: 16px 20px;
            }

            #positioning .positioning-quote {
                padding: 24px;
            }
        }
    </style>
<link rel="icon" href="./imgs/favicon.png" type="image/png">
    <style>
    /* === Conversion CTA bands (additive; existing design tokens) === */
    .cta-band { padding: var(--space-2xl) 0; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); text-align: center; }
    .cta-band--tint { background: var(--color-bg-secondary); }
    .cta-band .container { max-width: 720px; }
    .cta-band h2 { font-size: clamp(24px, 3vw, 34px); line-height: 1.2; margin-bottom: var(--space-sm); }
    .cta-band p { color: var(--color-text-secondary); font-size: clamp(16px, 1.8vw, 19px); line-height: 1.7; margin: 0 auto var(--space-lg); max-width: 600px; }
    .cta-band-actions { display: flex; gap: var(--space-sm); justify-content: center; flex-wrap: wrap; }
    /* === Sticky CTA (premium, non-intrusive) === */
    .sticky-cta { position: fixed; bottom: 24px; right: 24px; z-index: 1200; max-width: 330px; background: var(--color-white); border: 1px solid var(--color-border); border-radius: 14px; box-shadow: 0 18px 44px rgba(0,0,0,0.16); padding: 18px 20px; display: flex; align-items: center; gap: 14px; opacity: 0; transform: translateY(16px); pointer-events: none; transition: opacity .5s ease, transform .5s ease; }
    .sticky-cta.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
    .sticky-cta-text { font-size: 14px; font-weight: 600; color: var(--color-text-primary); line-height: 1.35; }
    .sticky-cta .btn { padding: 10px 18px; font-size: 13px; white-space: nowrap; }
    .sticky-cta-close { position: absolute; top: 6px; right: 9px; background: none; border: none; font-size: 17px; line-height: 1; color: var(--color-text-secondary); cursor: pointer; padding: 2px 4px; }
    .sticky-cta-close:hover { color: var(--color-text-primary); }
    @media (max-width: 520px) { .sticky-cta { left: 16px; right: 16px; bottom: 16px; max-width: none; } }
    </style>
    <style>picture{display:contents}</style>
    <script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","mainEntity":[{"@type":"Question","name":"Who is Prof. Christian Farioli and what does he specialize in?","acceptedAnswer":{"@type":"Answer","text":"Prof. Christian Farioli is an AI strategy consultant and executive educator with over two decades of experience helping organizations navigate AI transformation. He specializes in bridging the gap between technical AI capabilities and sound business strategy, focusing on developing organizational wisdom rather than mere technology adoption. He has spoken at major global events including TEDx and the World Economic Forum in Davos. His work is particularly focused on empowering executives and boards to make confident, informed decisions in an AI-driven business landscape."}},{"@type":"Question","name":"What services does Prof. Christian Farioli offer to organizations?","acceptedAnswer":{"@type":"Answer","text":"Prof. Christian Farioli offers a range of services including keynote speaking, private board advisory sessions, and executive education programs. His keynote presentations are tailored for major corporate events, industry conferences, and global forums. Board advisory services provide private, high-level strategic guidance to leadership teams navigating AI adoption and digital transformation. Executive education programs are designed to equip senior leaders with the frameworks and decision-making skills needed to lead effectively in an AI-era."}},{"@type":"Question","name":"How does Prof. Farioli's approach differ from typical technology consultants?","acceptedAnswer":{"@type":"Answer","text":"Prof. Farioli's approach prioritizes organizational wisdom and confident decision-making over the simple deployment of technology tools. While many technology consultants focus on implementation and software selection, his work centers on helping leaders understand the strategic, cultural, and ethical dimensions of AI adoption. He helps organizations move beyond hype cycles to identify where AI can create genuine, measurable value. This human-centered, strategy-first methodology is designed to produce lasting change rather than short-term technological upgrades."}},{"@type":"Question","name":"How can I book Prof. Christian Farioli as a keynote speaker?","acceptedAnswer":{"@type":"Answer","text":"To book Prof. Christian Farioli as a keynote speaker, organizations should reach out through his official contact channels to discuss event requirements, audience profile, and thematic focus. Keynote engagements are typically customized to align with the specific strategic priorities and industry context of the hosting organization or event. Early outreach is recommended given the demand for his speaking engagements at major corporate and global events. Availability varies depending on his advisory and education commitments throughout the year."}}]}</script>
    <style>
      .home-faq{padding:var(--space-3xl) 0;background:var(--color-bg-secondary)}
      .home-faq .section-label{display:block;text-align:center}
      .home-faq h2{font-family:var(--font-accent);font-size:2.2rem;text-align:center;margin:var(--space-sm) 0 var(--space-2xl);color:var(--color-text-primary)}
      .home-faq-grid{max-width:860px;margin:0 auto;display:grid;gap:var(--space-xl)}
      .home-faq-item{padding-bottom:var(--space-xl);border-bottom:1px solid var(--color-border)}
      .home-faq-item:last-child{border-bottom:none}
      .home-faq-q{font-size:1.15rem;font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-sm);line-height:1.4}
      .home-faq-a{font-size:1rem;line-height:1.75;color:var(--color-text-secondary)}
      .home-faq-more{text-align:center;margin-top:var(--space-2xl)}
      .home-faq-more a{color:var(--color-accent);font-weight:600;text-decoration:none;border-bottom:1px solid var(--color-accent);padding-bottom:2px}
      .google-badge{display:inline-flex;align-items:center;gap:10px;margin-top:var(--space-lg);padding:8px 16px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);border-radius:999px;text-decoration:none;backdrop-filter:blur(4px);transition:background .2s}
      .google-badge:hover{background:rgba(255,255,255,.18)}
      .google-badge-stars{color:#FBBC04;font-size:.95rem;letter-spacing:1px}
      .google-badge-text{color:var(--color-text-light);font-size:.9rem}
      .google-badge-text strong{color:var(--color-white)}
      .forbes-cred{display:inline-flex;align-items:center;gap:12px;margin-top:20px;text-decoration:none}
      .forbes-cred-label{color:rgba(255,255,255,.55);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
      .forbes-cred img{height:26px;width:auto;filter:brightness(0) invert(1);opacity:.85;transition:filter .3s ease,opacity .3s ease}
      .forbes-cred:hover img{filter:none;opacity:1}
    </style>
    <style>
      /* 3) logo marquee */
      .marquee{overflow:hidden;position:relative;max-width:1200px;margin:0 auto;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
      .marquee+.marquee{margin-top:30px}
      .marquee-track{display:flex;align-items:center;gap:92px;width:max-content;padding:8px 0;background:var(--color-bg-secondary)}
      
      
      .marquee img{height:52px;width:auto;max-width:185px;object-fit:contain;filter:grayscale(100%)!important;opacity:.6;mix-blend-mode:multiply;transition:filter .3s ease,opacity .3s ease,transform .3s ease}
      .marquee img:hover{filter:grayscale(0)!important;opacity:1;transform:scale(1.03)}
      .marquee img.lg{height:68px}
      .marquee img.lit{filter:grayscale(0)!important;opacity:1}
      .trusted-link{display:inline-block;margin-top:34px}
      
      @media (max-width:600px){.marquee-track{gap:52px}.marquee img{height:38px}.marquee img.lg{height:50px}}
      /* 6) Ken Burns + grain */
      .hero-video{animation:heroKB 26s ease-in-out infinite alternate;will-change:transform}
      @keyframes heroKB{from{transform:scale(1)}to{transform:scale(1.07)}}
      .hero-grain{position:absolute;top:0;left:0;width:100%;height:calc(100% - 72px);margin-top:72px;pointer-events:none;z-index:2;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:overlay}
      /* 4) manifesto progressive highlight */
      .manifesto-quote .mw{opacity:.22;transition:opacity .3s ease}
      .manifesto-quote .mw.on{opacity:1}
      /* 5) card lifts */
      .speaking-card,.insight-card{transition:transform .35s cubic-bezier(0.22,1,0.36,1),box-shadow .35s ease}
      .speaking-card:hover,.insight-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(0,0,0,.12)}
      /* 5b) touch feedback (mobile) */
      @media (hover:none){
        .speaking-card:active,.insight-card:active{transform:translateY(-4px) scale(.99);box-shadow:0 14px 30px rgba(0,0,0,.14);transition-duration:.15s}
        .btn:active,.nav-cta:active{transform:scale(.96);transition-duration:.1s}
        .gr-card:active,.home-faq-item:active{transform:translateY(-3px);transition:transform .15s ease}
      }
      .marquee-track{flex-wrap:nowrap}
      @media (prefers-reduced-motion:reduce){
        .hero-video{animation:none}
        .manifesto-quote .mw{opacity:1}
      }
    </style>
    <link rel="stylesheet" href="./css/book-volumes.css">
    <script src="./js/book-volumes.js" defer></script>
</head>
<body>
    <!-- Google Tag Manager (noscript) -->
    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WBHW7L4"
    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
    <!-- End Google Tag Manager (noscript) -->
    <!-- Navigation -->
    <nav class="nav nav-light" id="mainNav">
        <div class="container nav-inner">
            <a href="#" class="nav-logo">
                <picture><source type="image/webp" srcset="./imgs/logo-black-2x.webp"><img width="130" height="57" src="./imgs/logo-black-2x.png" alt="Prof. Christian Farioli" class="logo-scrolled" style="height: 52px;"></picture>
                <picture><source type="image/webp" srcset="./imgs/logo-white-2x.webp"><img width="130" height="57" src="./imgs/logo-white-2x.png" alt="Prof. Christian Farioli" class="logo-top" style="height: 52px;"></picture>
            </a>

            <div class="nav-links" id="navLinks">
                <a href="#positioning" class="nav-link">About</a>
                <span class="nav-dropdown">
                    <a href="/ai-keynote-speaker-dubai/" class="nav-link">Speaking</a>
                    <span class="nav-dropdown-menu">
                        <a href="/past-events.html">Past Events</a>
                    </span>
                </span>
                <a href="/insights/" class="nav-link">Insights</a>
                <a href="#books" class="nav-link">Books</a>
                <a href="/testimonials.html" class="nav-link">Testimonials</a>
                <a href="/clients.html" class="nav-link">Clients</a>
                <a href="https://future.christianfarioli.com" target="_blank" rel="noopener" class="nav-link">Future</a>
                <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="nav-cta">Work Together</a>
            </div>

            <button class="nav-mobile-toggle" id="navToggle" aria-label="Toggle menu">
                <span></span>
                <span></span>
                <span></span>
            </button>
        </div>
    </nav>

    <!-- Hero Section -->
    <section class="hero">
        <video class="hero-video" autoplay muted loop playsinline preload="metadata" poster="./imgs/hero-poster.jpg">
            <source src="./videos/hero-header.mp4?v=2" type="video/mp4">
        </video>
        <div class="hero-overlay"></div>
        <div class="hero-grain" aria-hidden="true"></div>

        <div class="hero-content">
            <span class="hero-tagline fade-up">Professor & AI Strategist</span>
            <h1 class="text-hero hero-title blur-in stagger-1">
                Leading with Clarity in the Age of AI</h1>
            <p class="hero-subtitle blur-in stagger-2">
                I help executives and organizations move beyond the noise — to develop clear thinking, confident strategy, and the wisdom to lead transformation that actually works.
            </p>
            <div class="hero-ctas blur-in stagger-3">
                <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-light">Book a Strategy Call</a>
                <a href="/insights/" class="btn btn-outline-light">Explore Insights</a>
            </div>
            <a href="https://christianfarioli.com/testimonials" target="_blank" rel="noopener" class="google-badge blur-in stagger-3" aria-label="4.9 stars on Google from 62 reviews — read testimonials">
                <span class="google-badge-stars" aria-hidden="true">★★★★★</span>
                <span class="google-badge-text"><strong>4.9</strong> on Google · 62 reviews</span>
            </a>
            <a href="https://forbes.com.mx/author/prof-christian-farioli/" target="_blank" rel="noopener" class="forbes-cred" aria-label="Featured in Forbes">
                <span class="forbes-cred-label">Featured in</span>
                <picture><source type="image/webp" srcset="./imgs/forbes-logo.webp"><img src="./imgs/forbes-logo.png" alt="Forbes" width="104" height="26"></picture>
            </a>
        </div>

        <div class="hero-scroll">
            <span class="hero-scroll-text">Scroll to explore</span>
            <div class="hero-scroll-line"></div>
        </div>
    </section>

    <!-- Signature Moment: Manifesto Section -->
    <!-- Trusted by (client logos) -->
    <section class="trusted-strip">
        <div class="container">
            <p class="trusted-label">Trusted by leading organizations worldwide</p>
            <div class="marquee">
                <div class="marquee-track">
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-13.webp"><img loading="lazy" src="./imgs/clients/mq/client-13.png" alt="Google" width="140" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-36.webp"><img loading="lazy" src="./imgs/clients/mq/client-36.png" alt="Huawei" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-03.webp"><img loading="lazy" src="./imgs/clients/mq/client-03.png" alt="NASA" width="55" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-05.webp"><img loading="lazy" src="./imgs/clients/mq/client-05.png" alt="TEDx" width="157" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-11.webp"><img loading="lazy" src="./imgs/clients/mq/client-11.png" alt="World Economic Forum" width="75" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-02.webp"><img loading="lazy" src="./imgs/clients/mq/client-02.png" alt="Bloomberg" width="230" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-76.webp"><img loading="lazy" src="./imgs/clients/mq/client-76.png" alt="CNBC" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-44.webp"><img loading="lazy" src="./imgs/clients/mq/client-44.png" alt="Thomson Reuters" width="41" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-09.webp"><img loading="lazy" src="./imgs/clients/mq/client-09.png" alt="PwC" width="61" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-10.webp"><img loading="lazy" src="./imgs/clients/mq/client-10.png" alt="EY" width="45" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-60.webp"><img loading="lazy" src="./imgs/clients/mq/client-60.png" alt="Novartis" width="212" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-58.webp"><img loading="lazy" src="./imgs/clients/mq/client-58.png" alt="Bayer" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-13.webp"><img loading="lazy" src="./imgs/clients/mq/client-13.png" alt="Google" width="140" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-36.webp"><img loading="lazy" src="./imgs/clients/mq/client-36.png" alt="Huawei" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-03.webp"><img loading="lazy" src="./imgs/clients/mq/client-03.png" alt="NASA" width="55" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-05.webp"><img loading="lazy" src="./imgs/clients/mq/client-05.png" alt="TEDx" width="157" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-11.webp"><img loading="lazy" src="./imgs/clients/mq/client-11.png" alt="World Economic Forum" width="75" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-02.webp"><img loading="lazy" src="./imgs/clients/mq/client-02.png" alt="Bloomberg" width="230" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-76.webp"><img loading="lazy" src="./imgs/clients/mq/client-76.png" alt="CNBC" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-44.webp"><img loading="lazy" src="./imgs/clients/mq/client-44.png" alt="Thomson Reuters" width="41" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-09.webp"><img loading="lazy" src="./imgs/clients/mq/client-09.png" alt="PwC" width="61" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-10.webp"><img loading="lazy" src="./imgs/clients/mq/client-10.png" alt="EY" width="45" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-60.webp"><img loading="lazy" src="./imgs/clients/mq/client-60.png" alt="Novartis" width="212" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-58.webp"><img loading="lazy" src="./imgs/clients/mq/client-58.png" alt="Bayer" width="46" height="46"></picture>
                </div>
            </div>
            <div class="marquee marquee-reverse">
                <div class="marquee-track">
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-67.webp"><img loading="lazy" src="./imgs/clients/mq/client-67.png" alt="Etisalat" width="39" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-52.webp"><img loading="lazy" src="./imgs/clients/mq/client-52.png" alt="Emaar" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-78.webp"><img loading="lazy" src="./imgs/clients/mq/client-78.png" alt="ADNOC" width="104" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-79.webp"><img loading="lazy" src="./imgs/clients/mq/client-79.png" alt="Mubadala" width="128" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-77.webp"><img loading="lazy" src="./imgs/clients/mq/client-77.png" alt="Saudi Aramco" width="162" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-75.webp"><img loading="lazy" src="./imgs/clients/mq/client-75.png" alt="Ferrari" width="29" height="46" class="lg"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-72.webp"><img loading="lazy" src="./imgs/clients/mq/client-72.png" alt="Bvlgari" width="466" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-73b.webp"><img loading="lazy" src="./imgs/clients/mq/client-73b.png" alt="Armani" width="67" height="46" class="lg"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-57.webp"><img loading="lazy" src="./imgs/clients/mq/client-57.png" alt="Eli Lilly" width="85" height="46"></picture>
                    <img loading="lazy" src="./imgs/clients/coca-cola.svg" alt="Coca-Cola" width="121" height="38">
                    <img loading="lazy" src="./imgs/clients/schneider-electric.svg" alt="Schneider Electric" width="126" height="38">
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-63b.webp"><img loading="lazy" src="./imgs/clients/mq/client-63b.png" alt="Burj Al Arab" width="51" height="46" class="lg"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-67.webp"><img loading="lazy" src="./imgs/clients/mq/client-67.png" alt="Etisalat" width="39" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-52.webp"><img loading="lazy" src="./imgs/clients/mq/client-52.png" alt="Emaar" width="46" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-78.webp"><img loading="lazy" src="./imgs/clients/mq/client-78.png" alt="ADNOC" width="104" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-79.webp"><img loading="lazy" src="./imgs/clients/mq/client-79.png" alt="Mubadala" width="128" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-77.webp"><img loading="lazy" src="./imgs/clients/mq/client-77.png" alt="Saudi Aramco" width="162" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-75.webp"><img loading="lazy" src="./imgs/clients/mq/client-75.png" alt="Ferrari" width="29" height="46" class="lg"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-72.webp"><img loading="lazy" src="./imgs/clients/mq/client-72.png" alt="Bvlgari" width="466" height="46"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-73b.webp"><img loading="lazy" src="./imgs/clients/mq/client-73b.png" alt="Armani" width="67" height="46" class="lg"></picture>
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-57.webp"><img loading="lazy" src="./imgs/clients/mq/client-57.png" alt="Eli Lilly" width="85" height="46"></picture>
                    <img loading="lazy" src="./imgs/clients/coca-cola.svg" alt="Coca-Cola" width="121" height="38">
                    <img loading="lazy" src="./imgs/clients/schneider-electric.svg" alt="Schneider Electric" width="126" height="38">
                    <picture><source type="image/webp" srcset="./imgs/clients/mq/client-63b.webp"><img loading="lazy" src="./imgs/clients/mq/client-63b.png" alt="Burj Al Arab" width="51" height="46" class="lg"></picture>
                </div>
            </div>
            
            <a href="/clients.html" class="trusted-link">See all clients &rarr;</a>
        </div>
    </section>

    <section class="manifesto" id="manifesto">
        <div class="manifesto-content fade-up">
            <blockquote class="manifesto-quote">
                "The question isn't whether AI will transform your organization. The question is whether <em>you'll be leading that transformation</em> — or caught in someone else's."
            </blockquote>
            <div class="manifesto-attribution">
                <span></span>
                Prof. Christian Farioli
            </div>
        </div>
    </section>

    <!-- Personal Philosophy: Human-Centered AI -->
    <section class="philosophy" id="philosophy">
        <div class="container">
            <div class="philosophy-inner">
                <div class="philosophy-label fade-up">
                    <span class="text-caption text-secondary">A Different Perspective</span>
                </div>
                <h2 class="philosophy-heading fade-up stagger-1">
                    Technology should create clarity, not confusion.
                </h2>
                <p class="philosophy-text fade-up stagger-2">
                    After working with hundreds of executives across industries, I've seen the same pattern repeat itself: organizations overwhelmed by AI hype, chasing tools instead of outcomes, measuring adoption instead of impact.
                </p>
                <p class="philosophy-text fade-up stagger-3">
                    My approach is different. I believe the goal of AI transformation isn't to adopt more technology — it's to develop clearer thinking, more confident decision-making, and the organizational wisdom to create value that actually matters.
                </p>
                <div class="philosophy-signature fade-up stagger-4">
                    <span class="philosophy-quote-mark">"</span>
                    <em>The future belongs to leaders who can distinguish signal from noise.</em>
                </div>
            </div>
        </div>
    </section>

    <!-- Positioning Section -->
    <section class="section positioning" id="positioning">
        <div class="container">
            <div class="positioning-grid">
                <div class="positioning-content fade-up">
                    <h2>The Voice You Need<br>in the Age of AI</h2>
                    <p>
                        After two decades working with Fortune 500 executives, global organizations, and visionary leaders, I've learned one thing: technology without wisdom is just noise.
                    </p>
                    <p>
                        My work bridges the gap between what's technically possible and what's strategically sound. I help leaders cut through the hype, understand what AI actually means for their organizations, and develop strategies that create real, lasting value. I also share these perspectives as a <a href="https://forbes.com.mx/author/prof-christian-farioli/" target="_blank" rel="noopener">Forbes contributor</a>.
                    </p>

                    <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-primary mt-lg">Let's Work Together</a>
                </div>

                <div class="positioning-image slide-in-right fade-up stagger-2">
                    <img width="1080" height="720" src="./imgs/christian-farioli-on-stage-20260909.jpg" alt="Prof. Christian Farioli speaking on stage in an auditorium" loading="lazy" decoding="async">
                    <div class="positioning-image-badge">
                        <span>Trusted by leaders from</span>
                        <strong>30+ Countries</strong>
                    </div>
                </div>

                <div class="positioning-quote">
                    <blockquote>
                        "The goal isn't to implement AI — it's to transform how your organization thinks, decides, and creates value."
                    </blockquote>
                </div>
            </div>
        </div>
    </section>

    <!-- Stats Section -->
    <section class="stats">
        <div class="container">
            <div class="stats-header fade-up">
                <h2 class="text-section-title text-light">Global Impact</h2>
                <p>Two decades of helping leaders navigate transformation across industries and borders.</p>
            </div>

            <div class="stats-grid">
                <div class="stat-item fade-up stagger-1">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <circle cx="12" cy="12" r="10"/>
                            <path d="M2 12h20"/>
                            <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>30</span>+</div>
                    <div class="stat-label">Countries</div>
                </div>
                <div class="stat-item fade-up stagger-2">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
                            <circle cx="9" cy="7" r="4"/>
                            <path d="M23 21v-2a4 4 0 0 0-3-3.87"/>
                            <path d="M16 3.13a4 4 0 0 1 0 7.75"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>20,000</span>+</div>
                    <div class="stat-label">Executives Trained</div>
                </div>
                <div class="stat-item fade-up stagger-3">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <path d="M12 2L2 7l10 5 10-5-10-5z"/>
                            <path d="M2 17l10 5 10-5"/>
                            <path d="M2 12l10 5 10-5"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>200</span>+</div>
                    <div class="stat-label">Keynotes</div>
                </div>
                <div class="stat-item fade-up stagger-4">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <circle cx="12" cy="12" r="10"/>
                            <polyline points="12 6 12 12 16 14"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>20</span>+</div>
                    <div class="stat-label">Years Experience</div>
                </div>
                <div class="stat-item fade-up stagger-5">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/>
                            <path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>3</span></div>
                    <div class="stat-label">Books</div>
                </div>
                <div class="stat-item fade-up stagger-6">
                    <div class="stat-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                            <rect x="2" y="3" width="20" height="14" rx="2" ry="2"/>
                            <line x1="8" y1="21" x2="16" y2="21"/>
                            <line x1="12" y1="17" x2="12" y2="21"/>
                        </svg>
                    </div>
                    <div class="stat-number"><span>50</span>+</div>
                    <div class="stat-label">Media Features</div>
                </div>
            </div>
        </div>
    </section>

    <!-- CTA: AI Strategy (after Global Impact) -->
    <section class="cta-band cta-band--tint">
        <div class="container">
            <h2>Let's Discuss Your AI Strategy</h2>
            <p>Whether you're exploring AI adoption, executive education, AISO or leadership transformation, let's start the conversation.</p>
            <div class="cta-band-actions">
                <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-primary">Schedule a Call</a>
            </div>
        </div>
    </section>

    <!-- Speaking Section -->
    <section class="section speaking" id="speaking">
        <div class="container">
            <div class="speaking-header fade-up">
                <h2>Speaking & Advisory</h2>
                <p>From main stages at global conferences to private board sessions — clarity and energy that transforms thinking.</p>
            </div>

            <div class="speaking-grid">
                <div class="speaking-featured fade-up">
                    <img loading="lazy" decoding="async" width="1920" height="1080" src="./imgs/nasa-standing-ovation-20260909.jpg" alt="Prof. Christian Farioli on stage with a NASA backdrop">
                    <div class="speaking-featured-overlay">
                        <h3>Keynote Speaking</h3>
                        <p>TEDx, Davos, major global conferences, and corporate events</p>
                    </div>
                </div>

                <div class="speaking-cards">
                    <div class="speaking-card fade-up stagger-1">
                        <div class="speaking-card-icon">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <path d="M12 2L2 7l10 5 10-5-10-5z"/>
                                <path d="M2 17l10 5 10-5"/>
                                <path d="M2 12l10 5 10-5"/>
                            </svg>
                        </div>
                        <div>
                            <h4>Keynote Speaking</h4>
                            <p>TEDx, Davos, corporate events, and global conferences</p>
                        </div>
                    </div>

                    <div class="speaking-card fade-up stagger-2">
                        <div class="speaking-card-icon">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/>
                                <circle cx="9" cy="7" r="4"/>
                                <path d="M23 21v-2a4 4 0 0 0-3-3.87"/>
                                <path d="M16 3.13a4 4 0 0 1 0 7.75"/>
                            </svg>
                        </div>
                        <div>
                            <h4>Executive Advisory</h4>
                            <p>Strategic counsel for C-suite leaders and boards</p>
                        </div>
                    </div>

                    <div class="speaking-card fade-up stagger-3">
                        <div class="speaking-card-icon">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                                <path d="M22 10v6M2 10l10-5 10 5-10 5z"/>
                                <path d="M6 12v5c3 3 9 3 12 0v-5"/>
                            </svg>
                        </div>
                        <div>
                            <h4>Corporate Training</h4>
                            <p>AI literacy programs for enterprise leadership teams</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Past Events preview -->
            <div class="events-preview fade-up">
                <div class="events-preview-stats">
                    <div><strong>20,000+</strong><span>Executives Trained</span></div>
                    <div><strong>300+</strong><span>Trainings &amp; Keynotes</span></div>
                    <div><strong>4</strong><span>Continents</span></div>
                </div>
                <div class="events-preview-grid">
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-cdo-bloomberg-speaker.webp"><img width="1024" height="682" src="./imgs/events/event-christian-farioli-cdo-bloomberg-speaker.jpg" alt="CDO Bloomberg Speaker" loading="lazy"></picture><span class="events-preview-caption">CDO Bloomberg Speaker</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-nasa-conference.webp"><img width="1024" height="696" src="./imgs/events/event-christian-farioli-nasa-conference.jpg" alt="NASA Conference" loading="lazy"></picture><span class="events-preview-caption">NASA Conference</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-burj-al-arab-digital-marketing.webp"><img width="1024" height="682" src="./imgs/events/event-burj-al-arab-digital-marketing.jpg" alt="Burj Al Arab Digital Marketing" loading="lazy"></picture><span class="events-preview-caption">Burj Al Arab Digital Marketing</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-brand-summit-bahrain.webp"><img width="960" height="609" src="./imgs/events/event-brand-summit-bahrain.jpg" alt="Brand Summit Bahrain" loading="lazy"></picture><span class="events-preview-caption">Brand Summit Bahrain</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-abu-dhabi-training.webp"><img width="1024" height="768" src="./imgs/events/event-christian-farioli-abu-dhabi-training.jpg" alt="Abu Dhabi Training" loading="lazy"></picture><span class="events-preview-caption">Abu Dhabi Training</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-build-digital-brands-conference.webp"><img width="1024" height="768" src="./imgs/events/event-christian-farioli-build-digital-brands-conference.jpg" alt="Build Digital Brands Conference" loading="lazy"></picture><span class="events-preview-caption">Build Digital Brands Conference</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-speaker-at-google.webp"><img width="1024" height="768" src="./imgs/events/event-christian-farioli-speaker-at-google.jpg" alt="Speaker at Google" loading="lazy"></picture><span class="events-preview-caption">Speaker at Google</span></a>
                    <a href="/past-events.html" class="events-preview-item"><picture><source type="image/webp" srcset="./imgs/events/event-christian-farioli-conference-speaker.webp"><img width="1024" height="768" src="./imgs/events/event-christian-farioli-conference-speaker.jpg" alt="Conference Speaker" loading="lazy"></picture><span class="events-preview-caption">Conference Speaker</span></a>
                </div>
                <div class="events-preview-more">
                    <a href="/past-events.html" class="btn btn-secondary">View All Past Events</a>
                </div>
            </div>
            <div class="speaking-cta fade-up">
                <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-primary">Invite Prof. Christian to Speak</a>
            </div>
        </div>
    </section>

    <!-- CTA: Speaking & Advisory -->
    <section class="cta-band">
        <div class="container">
            <h2>The talk ends. The impact doesn’t.</h2>
            <p>Bring Prof. Christian Farioli to your next event and give your audience a new perspective on AI, business and what comes next.</p>
            <div class="cta-band-actions">
                <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-primary">Let’s talk about your event</a>
            </div>
        </div>
    </section>

    <!-- Books Section -->
        <section class="section books" id="books">
        <div class="container">
            <div class="books-header fade-up">
                <h2>Books & Publications</h2>
            </div>

            <div class="books-grid">
                <div class="book-featured">
                    <div class="book-cover book-stage book-stage--ai" data-book-stage>
                        <div class="book-volume">
                        <div class="book-front">
                        <picture><source type="image/webp" srcset="./imgs/book-pizza-ai-cover.webp"><img loading="lazy" width="800" height="1220" src="./imgs/book-pizza-ai-cover.jpg" alt="Pizza and A.I. book cover"></picture>
                        </div>
                        <span class="book-spine" aria-hidden="true"></span>
                        <span class="book-pages book-pages--side" aria-hidden="true"></span>
                        <span class="book-pages book-pages--top" aria-hidden="true"></span>
                        <span class="book-pages book-pages--bottom" aria-hidden="true"></span>
                        </div>
                    </div>
                    <div class="book-info">
                        <h3>Pizza and A.I.</h3>
                        <p class="text-secondary">A Tasty Combo for Insightful Managers</p>
                        <p>
                            Harnessing the power of artificial intelligence and ChatGPT for strategic decision-making and business growth &mdash; a practical, insightful guide for managers navigating the AI era.
                        </p>
                        <a href="https://www.amazon.com/-/en/Pizza-Insightful-Harnessing-Intelligence-Decision-Making/dp/B0CX83THWW/" target="_blank" rel="noopener" class="btn btn-primary">Get the Book</a>
                    </div>
                </div>

                <div class="books-list">
                    <a href="https://www.amazon.com/-/en/Pizza-Guide-Digital-Marketing-Delicious/dp/0648505049/" target="_blank" rel="noopener" class="book-item" style="text-decoration:none;color:inherit;">
                        <div class="book-item-thumb book-stage book-stage--marketing" data-book-stage>
                            <div class="book-volume">
                            <div class="book-front">
                            <picture><source type="image/webp" srcset="./imgs/book-pizza-guide-to-digital-marketing.webp"><img loading="lazy" width="1050" height="1600" src="./imgs/book-pizza-guide-to-digital-marketing.jpg" alt="The Pizza Guide to Digital Marketing cover"></picture>
                            </div>
                            <span class="book-spine" aria-hidden="true"></span>
                            <span class="book-pages book-pages--side" aria-hidden="true"></span>
                            <span class="book-pages book-pages--top" aria-hidden="true"></span>
                            <span class="book-pages book-pages--bottom" aria-hidden="true"></span>
                            </div>
                        </div>
                        <div class="book-item-info">
                            <h4>The Pizza Guide to Digital Marketing</h4>
                            <p>A delicious first byte of the biggest business game changers of your lifetime</p>
                        </div>
                    </a>
                    <a href="https://www.amazon.com/-/en/Christian-Farioli-ebook/dp/B007QPOX7S/" target="_blank" rel="noopener" class="book-item" style="text-decoration:none;color:inherit;">
                        <div class="book-item-thumb book-stage book-stage--discipline" data-book-stage>
                            <div class="book-volume">
                            <div class="book-front">
                            <img loading="lazy" width="286" height="445" src="./imgs/book-disciplina-per-la-vita.jpg" alt="Disciplina per la Vita cover">
                            </div>
                            <span class="book-spine" aria-hidden="true"></span>
                            <span class="book-pages book-pages--side" aria-hidden="true"></span>
                            <span class="book-pages book-pages--top" aria-hidden="true"></span>
                            <span class="book-pages book-pages--bottom" aria-hidden="true"></span>
                            </div>
                        </div>
                        <div class="book-item-info">
                            <h4>Disciplina per la Vita</h4>
                            <p>In 12 semplici passi &mdash; with Bob Urichuck</p>
                        </div>
                    </a>
                </div>
            </div>

            <a href="https://forbes.com.mx/author/prof-christian-farioli/" target="_blank" rel="noopener" class="forbes-publication fade-up">
                <picture class="forbes-publication-logo"><source type="image/webp" srcset="./imgs/forbes-logo.webp"><img loading="lazy" src="./imgs/forbes-logo.png" alt="Forbes" width="351" height="88"></picture>
                <div class="forbes-publication-copy">
                    <h3>Forbes Contributor</h3>
                    <p>I write for Forbes M&eacute;xico, sharing perspectives on AI, business strategy and leadership.</p>
                </div>
                <span class="forbes-publication-action">Read my articles on Forbes <span aria-hidden="true">&nearr;</span></span>
            </a>
        </div>
    </section>

    <!-- Insights Section -->
    <section class="section insights" id="insights">
        <div class="container">
            <div class="insights-header fade-up">
                <div>
                    <h2>Latest Insights</h2>
                    <p>Thought leadership on AI, strategy, and the future of work.</p>
                </div>
                <a href="/insights/" class="btn btn-secondary">View All Insights</a>
            </div>

            <div class="insights-grid">
                <a href="/insights/" class="insight-card fade-up stagger-1">
                    <div class="insight-card-image">
                        <img loading="lazy" decoding="async" width="4476" height="2984" src="./imgs/speak-in-cairo-20260909.jpg" alt="Prof. Christian Farioli leading an interactive workshop in Cairo, with the pyramids in the background" style="object-position: 50% 0%;">
                    </div>
                    <div class="insight-card-content">
                        <span class="insight-card-category">AI Strategy</span>
                        <h3>The Executive's Guide to AI Decision-Making</h3>
                        <p>How leaders can develop the clarity and confidence to make strategic AI decisions that drive lasting value.</p>
                        <div class="insight-card-meta">
                            <span>8 min read</span>
                            <span>•</span>
                            <span>March 2025</span>
                        </div>
                    </div>
                </a>

                <a href="/insights/" class="insight-card fade-up stagger-2">
                    <div class="insight-card-image">
                        <img loading="lazy" width="1024" height="768" src="./imgs/Christian-Farioli-Speaker-NASA.jpg" alt="Future of Work article">
                    </div>
                    <div class="insight-card-content">
                        <span class="insight-card-category">Future of Work</span>
                        <h3>Beyond Automation: The Human Edge in an AI World</h3>
                        <p>Why human judgment, creativity, and emotional intelligence remain irreplaceable.</p>
                        <div class="insight-card-meta">
                            <span>6 min read</span>
                            <span>•</span>
                            <span>February 2025</span>
                        </div>
                    </div>
                </a>

                <a href="/insights/" class="insight-card fade-up stagger-3">
                    <div class="insight-card-image">
                        <img loading="lazy" width="1024" height="682" src="./imgs/Christian-Farioli-CDO-Bloomberg-Speaker.jpg" alt="AI Transformation article">
                    </div>
                    <div class="insight-card-content">
                        <span class="insight-card-category">Transformation</span>
                        <h3>Building AI-Ready Organizations: A Leadership Playbook</h3>
                        <p>Strategic frameworks for preparing your organization to thrive in the age of AI.</p>
                        <div class="insight-card-meta">
                            <span>10 min read</span>
                            <span>•</span>
                            <span>January 2025</span>
                        </div>
                    </div>
                </a>
            </div>

            <div class="insights-cta fade-up">
                <a href="/insights/" class="btn btn-primary">Read Latest Insights</a>
            </div>
        </div>
    </section>

    <!-- Testimonials Section - Premium Rotating Carousel -->


    <section class="testimonials-section" id="testimonials">
        <div class="container">
            <div class="testimonials-header fade-up">
                <span class="testimonials-label">Trusted Globally</span>
                <h2>What Leaders Say</h2>
                <p>Executives and organizations sharing their experience working with Prof. Christian Farioli.</p>
            </div>

            <!-- Rotating Testimonial Carousel -->
            <div class="testimonial-carousel" id="testimonialCarousel">
                <div class="testimonial-track">
                    <div class="testimonial-slide active">
                        <div class="testimonial-quote-large">
                            <svg class="quote-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/></svg>
                            <p>"Prof. Christian Farioli was truly inspiring during his session in Abu Dhabi on fintech and digital payments. He shared clear, practical insights on innovation, digital transformation, and the future of payments. Truly an inspiring professor."</p>
                        </div>
                        <div class="testimonial-author-carousel">
                            <div class="author-avatar"><picture><source type="image/webp" srcset="./imgs/testimonials/eissa-al-ghaneib.webp"><img width="98" height="98" src="./imgs/testimonials/eissa-al-ghaneib.png?v=3" alt="Eissa Al Ghareeb" loading="lazy"></picture></div>
                            <div class="author-info">
                                <h4>Eissa Al Ghareeb</h4>
                                <p>Central Bank of UAE</p>
                            </div>
                            <div class="company-logo"><span>Central Bank of UAE</span></div>
                        </div>
                    </div>
                    <div class="testimonial-slide">
                        <div class="testimonial-quote-large">
                            <svg class="quote-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/></svg>
                            <p>"Prof. Christian is a brilliant lecturer and experienced consultant. He has vast knowledge in digital marketing and a unique ability to deliver state-of-the-art techniques in an entertaining way. I highly recommend him."</p>
                        </div>
                        <div class="testimonial-author-carousel">
                            <div class="author-avatar"><picture><source type="image/webp" srcset="./imgs/mohamed-alqassab.webp"><img width="98" height="98" src="./imgs/mohamed-alqassab.png?v=3" alt="Mohamed AlQassab" loading="lazy"></picture></div>
                            <div class="author-info">
                                <h4>Mohamed AlQassab</h4>
                                <p>Head of Digital Services, Gulf International Bank</p>
                            </div>
                            <div class="company-logo"><span>Gulf International Bank</span></div>
                        </div>
                    </div>
                    <div class="testimonial-slide">
                        <div class="testimonial-quote-large">
                            <svg class="quote-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/></svg>
                            <p>"Creative digital genius. Not the usual stuff you can read about, but serious marketing intelligence insights that translate into business wisdom."</p>
                        </div>
                        <div class="testimonial-author-carousel">
                            <div class="author-avatar"><picture><source type="image/webp" srcset="./imgs/testimonials/michela-simone.webp"><img width="240" height="240" src="./imgs/testimonials/michela-simone.png?v=3" alt="Michela Simone" loading="lazy"></picture></div>
                            <div class="author-info">
                                <h4>Michela Simone</h4>
                                <p>Events & Marketing Director, Vogue Arabia</p>
                            </div>
                            <div class="company-logo"><span>Vogue Arabia</span></div>
                        </div>
                    </div>
                    <div class="testimonial-slide">
                        <div class="testimonial-quote-large">
                            <svg class="quote-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/></svg>
                            <p>"His humble approach and very straightforward thinking are indeed very valuable to any organization. I can personally recommend Prof. Christian and his Team."</p>
                        </div>
                        <div class="testimonial-author-carousel">
                            <div class="author-avatar"><picture><source type="image/webp" srcset="./imgs/testimonials/mirko-aru.webp"><img width="98" height="98" src="./imgs/testimonials/mirko-aru.png?v=3" alt="Mirko Aru" loading="lazy"></picture></div>
                            <div class="author-info">
                                <h4>Mirko Aru</h4>
                                <p>General Manager, Armani Hotel</p>
                            </div>
                            <div class="company-logo"><span>Armani Hotel</span></div>
                        </div>
                    </div>
                    <div class="testimonial-slide">
                        <div class="testimonial-quote-large">
                            <svg class="quote-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M14.017 21v-7.391c0-5.704 3.731-9.57 8.983-10.609l.995 2.151c-2.432.917-3.995 3.638-3.995 5.849h4v10h-9.983zm-14.017 0v-7.391c0-5.704 3.748-9.57 9-10.609l.996 2.151c-2.433.917-3.996 3.638-3.996 5.849h3.983v10h-9.983z"/></svg>
                            <p>"Prof. Christian is one of the best lecturers I have ever come across. His knowledge is amazing and I would recommend him to anyone interested in digital marketing."</p>
                        </div>
                        <div class="testimonial-author-carousel">
                            <div class="author-avatar"><picture><source type="image/webp" srcset="./imgs/testimonials/manasie-tiwari.webp"><img width="98" height="98" src="./imgs/testimonials/manasie-tiwari.png?v=3" alt="Manasie Tiwari" loading="lazy"></picture></div>
                            <div class="author-info">
                                <h4>Manasie Tiwari</h4>
                                <p>Communication Manager, Leo Burnett</p>
                            </div>
                            <div class="company-logo"><span>Leo Burnett</span></div>
                        </div>
                    </div>
                </div>

                <!-- Carousel Navigation -->
                <div class="carousel-nav">
                    <button class="carousel-dot active" data-slide="0" aria-label="Go to slide 1"></button>
                    <button class="carousel-dot" data-slide="1" aria-label="Go to slide 2"></button>
                    <button class="carousel-dot" data-slide="2" aria-label="Go to slide 3"></button>
                    <button class="carousel-dot" data-slide="3" aria-label="Go to slide 4"></button>
                    <button class="carousel-dot" data-slide="4" aria-label="Go to slide 5"></button>
                </div>
            </div>

            <!-- View All Testimonials Link -->
            <div class="testimonials-footer fade-up">
                <a href="./testimonials.html" class="view-all-link">
                    View All Testimonials
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M5 12h14M12 5l7 7-7 7"/>
                    </svg>
                </a>
            </div>
        </div>
    </section>

    <!-- CTA Section -->
    <section class="cta" id="cta">
        <div class="container">
            <div class="cta-inner fade-up">
                <h2 class="text-section-title">Ready to Apply These Ideas?</h2>
                <p>From executive briefings to enterprise AI transformation, let's explore the next step together.</p>

                <div class="cta-buttons">
                    <a href="https://calendly.com/chrisfarioli/30min" target="_blank" rel="noopener" class="btn btn-primary">Schedule a Call</a>
                    <a href="/ai-keynote-speaker-dubai/" class="btn btn-secondary">View Speaking Topics</a>
                </div>

                <div class="cta-options">
                    <div class="cta-option">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/>
                        </svg>
                        Keynote Speaking
                    </div>
                    <div class="cta-option">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
                            <circle cx="12" cy="7" r="4"/>
                        </svg>
                        Executive Advisory
                    </div>
                    <div class="cta-option">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
                            <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
                        </svg>
                        Corporate Training
                    </div>
                    <div class="cta-option">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
                        </svg>
                        Strategy Consulting
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- FAQ -->
    <section class="home-faq" id="faq">
        <div class="container">
            <span class="section-label">FAQ</span>
            <h2>Frequently Asked Questions</h2>
            <div class="home-faq-grid">
                <div class="home-faq-item">
                    <h3 class="home-faq-q">Who is Prof. Christian Farioli and what does he specialize in?</h3>
                    <p class="home-faq-a">Prof. Christian Farioli is an AI strategy consultant and executive educator with over two decades of experience helping organizations navigate AI transformation. He specializes in bridging the gap between technical AI capabilities and sound business strategy, focusing on developing organizational wisdom rather than mere technology adoption. He has spoken at major global events including TEDx and the World Economic Forum in Davos. His work is particularly focused on empowering executives and boards to make confident, informed decisions in an AI-driven business landscape.</p>
                </div>
                <div class="home-faq-item">
                    <h3 class="home-faq-q">What services does Prof. Christian Farioli offer to organizations?</h3>
                    <p class="home-faq-a">Prof. Christian Farioli offers a range of services including keynote speaking, private board advisory sessions, and executive education programs. His keynote presentations are tailored for major corporate events, industry conferences, and global forums. Board advisory services provide private, high-level strategic guidance to leadership teams navigating AI adoption and digital transformation. Executive education programs are designed to equip senior leaders with the frameworks and decision-making skills needed to lead effectively in an AI-era.</p>
                </div>
                <div class="home-faq-item">
                    <h3 class="home-faq-q">How does Prof. Farioli's approach differ from typical technology consultants?</h3>
                    <p class="home-faq-a">Prof. Farioli's approach prioritizes organizational wisdom and confident decision-making over the simple deployment of technology tools. While many technology consultants focus on implementation and software selection, his work centers on helping leaders understand the strategic, cultural, and ethical dimensions of AI adoption. He helps organizations move beyond hype cycles to identify where AI can create genuine, measurable value. This human-centered, strategy-first methodology is designed to produce lasting change rather than short-term technological upgrades.</p>
                </div>
                <div class="home-faq-item">
                    <h3 class="home-faq-q">How can I book Prof. Christian Farioli as a keynote speaker?</h3>
                    <p class="home-faq-a">To book Prof. Christian Farioli as a keynote speaker, organizations should reach out through his official contact channels to discuss event requirements, audience profile, and thematic focus. Keynote engagements are typically customized to align with the specific strategic priorities and industry context of the hosting organization or event. Early outreach is recommended given the demand for his speaking engagements at major corporate and global events. Availability varies depending on his advisory and education commitments throughout the year.</p>
                </div>
            </div>
            <div class="home-faq-more">
                <a href="/faq.html">See all frequently asked questions →</a>
            </div>
        </div>
    </section>

    <!-- Footer -->
    <footer class="footer" id="contact">
        <div class="container">
            <div class="footer-top">
                <div class="footer-brand">
                    <picture><source type="image/webp" srcset="./imgs/logo-white-2x.webp"><img loading="lazy" width="130" height="57" src="./imgs/logo-white-2x.png" alt="Prof. Christian Farioli" style="height: 56px; margin-bottom: 16px;"></picture>
                    <p>Helping leaders navigate artificial intelligence with clarity, strategic thinking, and human-centered wisdom.</p>
                    <div class="footer-social">
                        <a href="#" aria-label="LinkedIn">
                            <svg viewBox="0 0 24 24" fill="currentColor">
                                <path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/>
                            </svg>
                        </a>
                        <a href="#" aria-label="Twitter">
                            <svg viewBox="0 0 24 24" fill="currentColor">
                                <path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/>
                            </svg>
                        </a>
                        <a href="#" aria-label="YouTube">
                            <svg viewBox="0 0 24 24" fill="currentColor">
                                <path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/>
                            </svg>
                        </a>
                    </div>
                </div>

                <div class="footer-links">
                    <h4>Navigation</h4>
                    <ul>
                        <li><a href="#positioning">About</a></li>
                        <li><a href="/ai-keynote-speaker-dubai/">Speaking</a></li>
                        <li><a href="/insights/">Insights</a></li>
                        <li><a href="#books">Books</a></li>
                    </ul>
                </div>

                <div class="footer-links">
                    <h4>Services</h4>
                    <ul>
                        <li><a href="/ai-keynote-speaker-dubai/">Keynote Speaking</a></li>
                        <li><a href="#">Executive Advisory</a></li>
                        <li><a href="#">Corporate Training</a></li>
                        <li><a href="#">Strategy Consulting</a></li>
                    </ul>
                </div>

                <div class="footer-newsletter">
                    <h4>Join Executive AI Insights</h4>
                    <p>Weekly AI insights, leadership frameworks and practical guidance for decision-makers.</p>
                    <form class="footer-newsletter-form" onsubmit="return false;">
                        <input type="email" placeholder="Enter your email" required>
                        <button type="submit">Subscribe</button>
                    </form>
                </div>
            </div>

            <div class="footer-contact" style="text-align:center;padding:18px 0;border-top:1px solid rgba(255,255,255,.12);font-size:.95rem;color:rgba(255,255,255,.75)"><strong>Phone number &amp; WhatsApp</strong> <a href="https://wa.me/971509596182" style="color:#fff;text-decoration:underline">+971 50 9596 182</a></div>
            <div class="footer-bottom">
                <p class="footer-copyright">© 2025 Prof. Christian Farioli. All rights reserved.</p>
                <div class="footer-legal">
                    <a href="/faq.html">FAQ</a>
                    <a href="/privacy.html">Privacy Policy</a>
                    <a href="#">Terms of Service</a>
                </div>
            </div>
        </div>
    </footer>

    <script>
        // ============================================
        // NAVIGATION SCROLL EFFECT
        // ============================================
        const nav = document.getElementById('mainNav');
        const navToggle = document.getElementById('navToggle');
        const navLinks = document.getElementById('navLinks');

        window.addEventListener('scroll', () => {
            if (window.scrollY > 80) {
                nav.classList.add('scrolled');
                nav.classList.remove('nav-light');
            } else {
                nav.classList.remove('scrolled');
                nav.classList.add('nav-light');
            }
        });

        navToggle.addEventListener('click', () => {
            navLinks.classList.toggle('active');
        });

        // Close mobile nav when clicking a link
        document.querySelectorAll('.nav-links a').forEach(link => {
            link.addEventListener('click', () => {
                navLinks.classList.remove('active');
            });
        });

        // ============================================
        // ENHANCED SCROLL ANIMATIONS
        // ============================================

        // Multi-threshold IntersectionObserver for better animation triggers
        const observerOptions = {
            root: null,
            rootMargin: '0px 0px -10% 0px',
            threshold: [0, 0.1, 0.25, 0.5, 0.75, 1]
        };

        const observer = new IntersectionObserver((entries) => {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    // Add slight delay for staggered effect with IntersectionObserver
                    const delay = entry.target.dataset.delay || 0;
                    setTimeout(() => {
                        entry.target.classList.add('visible');
                    }, delay);
                }
            });
        }, observerOptions);

        // Observe all animated elements with data attributes
        document.querySelectorAll('.fade-up, .fade-scale, .slide-in-left, .slide-in-right, .blur-in').forEach((el, index) => {
            // Add stagger delay based on sibling position
            const parent = el.parentElement;
            const siblings = parent.querySelectorAll('.fade-up, .fade-scale, .slide-in-left, .slide-in-right, .blur-in');
            const siblingIndex = Array.from(siblings).indexOf(el);

            // Only apply auto-delay if no explicit delay is set
            if (!el.dataset.delay && el.classList.contains('stagger-1') ||
                el.classList.contains('stagger-2') ||
                el.classList.contains('stagger-3') ||
                el.classList.contains('stagger-4') ||
                el.classList.contains('stagger-5')) {
                // Stagger classes are handled via CSS
            } else {
                el.dataset.delay = siblingIndex * 50;
            }
            observer.observe(el);
        });

        // ============================================
        // SCROLL PROGRESS INDICATOR
        // ============================================
        const scrollProgress = document.createElement('div');
        scrollProgress.className = 'scroll-progress';
        document.body.appendChild(scrollProgress);

        // ============================================
        // NAV HIDE/SHOW ON SCROLL DIRECTION
        // ============================================
        let lastScrollTop = 0;
        let ticking = false;

        function updateNavOnScroll() {
            const scrollTop = window.pageYOffset || document.documentElement.scrollTop;

            // Scroll progress
            const docHeight = document.documentElement.scrollHeight - window.innerHeight;
            const scrollPercent = docHeight > 0 ? scrollTop / docHeight : 0;
            scrollProgress.style.transform = `scaleX(${scrollPercent})`;

            // Nav stays visible at all times (sticky) — hide-on-scroll removed
            nav.classList.remove('hidden');

            lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;
            ticking = false;
        }

        window.addEventListener('scroll', () => {
            if (!ticking) {
                requestAnimationFrame(updateNavOnScroll);
                ticking = true;
            }
        });

        // ============================================
        // PARALLAX EFFECTS
        // ============================================
        const parallaxElements = document.querySelectorAll('.parallax-element');

        function updateParallax() {
            const scrolled = window.pageYOffset;

            parallaxElements.forEach(el => {
                const speed = el.dataset.speed || 0.5;
                const yPos = -(scrolled * speed);
                el.style.transform = `translateY(${yPos}px)`;
            });
        }

        // Use requestAnimationFrame for smooth parallax
        let parallaxTicking = false;
        window.addEventListener('scroll', () => {
            if (!parallaxTicking) {
                requestAnimationFrame(updateParallax);
                parallaxTicking = true;
            }
        });

        // ============================================
        // SMOOTH SCROLL FOR ANCHOR LINKS
        // ============================================
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function(e) {
                e.preventDefault();
                const target = document.querySelector(this.getAttribute('href'));
                if (target) {
                    const navHeight = nav.offsetHeight;
                    const targetPosition = target.offsetTop - navHeight;
                    window.scrollTo({
                        top: targetPosition,
                        behavior: 'smooth'
                    });
                }
            });
        });

        // ============================================
        // MOUSE MOVE PARALLAX (Subtle)
        // ============================================
        const heroContent = document.querySelector('.hero-content');
        if (heroContent) {
            document.addEventListener('mousemove', (e) => {
                const mouseX = (e.clientX / window.innerWidth - 0.5) * 2;
                const mouseY = (e.clientY / window.innerHeight - 0.5) * 2;

                // Only apply in hero section
                if (e.clientY < window.innerHeight * 0.8) {
                    heroContent.style.transform = `translate(${mouseX * 10}px, ${mouseY * 10}px)`;
                }
            });

            // Reset on mouse leave
            document.addEventListener('mouseleave', () => {
                heroContent.style.transform = 'translate(0, 0)';
            });
        }

        // ============================================
        // TILT EFFECT ON CARDS
        // ============================================
        const tiltCards = document.querySelectorAll('.insight-card, .speaking-card, .testimonial-card');

        tiltCards.forEach(card => {
            card.addEventListener('mousemove', (e) => {
                const rect = card.getBoundingClientRect();
                const x = e.clientX - rect.left;
                const y = e.clientY - rect.top;

                const centerX = rect.width / 2;
                const centerY = rect.height / 2;

                const rotateX = (y - centerY) / 20;
                const rotateY = (centerX - x) / 20;

                card.style.transform = `perspective(1000px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) translateY(-8px)`;
            });

            card.addEventListener('mouseleave', () => {
                card.style.transform = 'perspective(1000px) rotateX(0) rotateY(0) translateY(0)';
            });
        });

        // ============================================
        // MAGNETIC BUTTON EFFECT
        // ============================================
        const magneticBtns = document.querySelectorAll('.btn');

        magneticBtns.forEach(btn => {
            btn.addEventListener('mousemove', (e) => {
                const rect = btn.getBoundingClientRect();
                const x = e.clientX - rect.left - rect.width / 2;
                const y = e.clientY - rect.top - rect.height / 2;

                btn.style.transform = `translate(${x * 0.2}px, ${y * 0.2}px)`;
            });

            btn.addEventListener('mouseleave', () => {
                btn.style.transform = 'translate(0, 0)';
            });
        });

        // ============================================
        // TESTIMONIAL CAROUSEL AUTO-ROTATION
        // ============================================
        const carouselTrack = document.querySelector('.testimonial-track');
        const slides = document.querySelectorAll('.testimonial-slide');
        const dots = document.querySelectorAll('.carousel-dot');
        let currentSlide = 0;
        let autoplayInterval;

        const showSlide = (index) => {
            slides.forEach(slide => slide.classList.remove('active'));
            dots.forEach(dot => dot.classList.remove('active'));
            slides[index].classList.add('active');
            dots[index].classList.add('active');
            currentSlide = index;
        };

        const nextSlide = () => {
            const next = (currentSlide + 1) % slides.length;
            showSlide(next);
        };

        const startAutoplay = () => {
            autoplayInterval = setInterval(nextSlide, 5000);
        };

        const stopAutoplay = () => {
            clearInterval(autoplayInterval);
        };

        // Click handlers for dots
        dots.forEach((dot, index) => {
            dot.addEventListener('click', () => {
                stopAutoplay();
                showSlide(index);
                startAutoplay();
            });
        });

        // Pause on hover
        if (carouselTrack) {
            carouselTrack.addEventListener('mouseenter', stopAutoplay);
            carouselTrack.addEventListener('mouseleave', startAutoplay);
        }

        // Start autoplay
        startAutoplay();

        // ============================================
        // IMAGE LAZY LOAD WITH BLUR
        // ============================================
        document.querySelectorAll('img[loading="lazy"]').forEach(img => {
            // Book covers stay sharp; their only animation is the volume's tilt.
            if (img.closest('#books .book-stage')) return;
            img.style.filter = 'blur(10px)';
            img.style.transition = 'filter 0.5s ease';

            img.addEventListener('load', () => {
                img.style.filter = 'blur(0)';
            });
        });
    </script>
















    <script>
    (function(){
      var rm=window.matchMedia('(prefers-reduced-motion: reduce)').matches;
      /* 4) manifesto word highlight */
      var q=document.querySelector('.manifesto-quote');
      if(q){
        (function wrap(node){Array.prototype.slice.call(node.childNodes).forEach(function(c){
          if(c.nodeType===3){var frag=document.createDocumentFragment();
            c.textContent.split(/(\s+)/).forEach(function(tok){
              if(/^\s*$/.test(tok)){frag.appendChild(document.createTextNode(tok));}
              else{var s=document.createElement('span');s.className='mw';s.textContent=tok;frag.appendChild(s);}});
            node.replaceChild(frag,c);}
          else if(c.nodeType===1){wrap(c);}});})(q);
        var words=q.querySelectorAll('.mw');
        function upd(){var r=q.getBoundingClientRect(),vh=window.innerHeight;
          var p=(vh*0.9-r.top)/(r.height+vh*0.45);p=Math.max(0,Math.min(1,p));
          var n=Math.floor(p*words.length);
          for(var i=0;i<words.length;i++){words[i].classList.toggle('on',i<n);}}
        if(rm){words.forEach(function(w){w.classList.add('on');});}
        else{window.addEventListener('scroll',upd,{passive:true});upd();}
      }
      /* 3) JS-driven marquee (immune to OS reduced-motion clamping) */
      document.querySelectorAll('.marquee').forEach(function(m){
        var track=m.querySelector('.marquee-track');if(!track)return;
        var dir=m.classList.contains('marquee-reverse')?1:-1;
        var speed=(window.innerWidth<600?46:38)*(dir===1?0.85:1);
        var x=0,last=null,paused=false,visible=true;
        m.addEventListener('mouseenter',function(){paused=true;});
        m.addEventListener('mouseleave',function(){paused=false;});
        new IntersectionObserver(function(es){visible=es[0].isIntersecting;}).observe(m);
        function frame(ts){
          if(last===null)last=ts;
          var dt=Math.min((ts-last)/1000,0.1);last=ts;
          if(!paused&&visible){
            var half=track.scrollWidth/2;
            if(half>0){x+=dir*speed*dt;
              if(x<=-half)x+=half; if(x>0)x-=half;
              track.style.transform='translateX('+x+'px)';}
          }
          requestAnimationFrame(frame);
        }
        requestAnimationFrame(frame);
      });
      /* mobile color spotlight: logos colorize crossing viewport center */
      if(window.matchMedia('(hover: none)').matches){
        var mimgs=document.querySelectorAll('.marquee img');
        setInterval(function(){
          var cx=window.innerWidth/2, zone=window.innerWidth*0.16, vh=window.innerHeight;
          mimgs.forEach(function(im){
            var r=im.getBoundingClientRect();
            if(r.width===0){im.classList.remove('lit');return;}
            var d=Math.abs((r.left+r.right)/2-cx);
            im.classList.toggle('lit', d<zone && r.top<vh && r.bottom>0);
          });
        },150);
      }
      if(rm)return;
      /* 5) magnetic buttons */
      document.querySelectorAll('.btn,.nav-cta').forEach(function(b){
        b.addEventListener('mousemove',function(e){var r=b.getBoundingClientRect();
          var dx=(e.clientX-r.left-r.width/2)/(r.width/2),dy=(e.clientY-r.top-r.height/2)/(r.height/2);
          b.style.transform='translate('+(dx*4)+'px,'+(dy*3)+'px)';});
        b.addEventListener('mouseleave',function(){b.style.transform='';});});
    })();
    </script>
    <script src="./js/global-impact.js" defer></script>
</body>
</html>
