/* --- bloc original 1/8 --- */
@font-face{font-family:'Benzin';src:url('/assets/fonts/Benzin-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
        @font-face{font-family:'Benzin';src:url('/assets/fonts/Benzin-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
        @font-face{font-family:'Benzin';src:url('/assets/fonts/Benzin-Semibold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
        @font-face{font-family:'Benzin';src:url('/assets/fonts/Benzin-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
        @font-face{font-family:'Benzin';src:url('/assets/fonts/Benzin-ExtraBold.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}

        *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

        :root {
            --primary: #ae0000;
            --secondary: #ffffff;
            --accent: #ae0000;
            --bg-deep: #000000;
            --bg-alt: #0a0a0a;
            --glass: rgba(255, 255, 255, 0.025);
            --glass-border: rgba(255, 255, 255, 0.06);
            --text: #fcfcfc;
            --text-bright: #ffffff;
            --text-muted: rgba(252, 252, 252, 0.65);
        }

        html { scroll-behavior: smooth; }

        body {
            font-family: 'Montserrat', sans-serif;
            background: var(--bg-deep);
            color: var(--text);
            min-height: 100vh;
            overflow-x: hidden;
            position: relative;
        }

        /* ─ BACKGROUND IMAGE (parallax) ─ */
        .bg-image {
            position: fixed;
            top: -10%; left: -5%;
            width: 110%; height: 120%;
            background: radial-gradient(ellipse at 30% 40%, rgba(174,0,0,0.4) 0%, transparent 60%), radial-gradient(ellipse at 70% 70%, rgba(40,0,0,0.6) 0%, transparent 55%), #0a0a0a;
            opacity: 0.06;
            z-index: 0;
            pointer-events: none;
            will-change: transform;
            transition: transform 0.1s linear;
        }

        /* ─ ONLINE STATUS ─ */
        .status-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 4px 12px;
            border-radius: 20px;
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.06);
            margin-bottom: 20px;
            font-size: 0.6rem;
            letter-spacing: 0.15em;
            text-transform: uppercase;
            font-family: 'Oswald', sans-serif;
            color: var(--text-muted);
        }
        .status-dot {
            width: 6px; height: 6px;
            border-radius: 50%;
            background: #22c55e;
            box-shadow: 0 0 8px rgba(34,197,94,0.5);
            animation: statusPulse 2s ease-in-out infinite;
        }
        @keyframes statusPulse {
            0%, 100% { opacity: 1; box-shadow: 0 0 8px rgba(34,197,94,0.5); }
            50% { opacity: 0.6; box-shadow: 0 0 4px rgba(34,197,94,0.3); }
        }

        /* ─ TYPING EFFECT ─ */
        .tagline {
            overflow: hidden;
            white-space: nowrap;
            border-right: 2px solid var(--secondary);
            width: 0;
            animation: typing 2.5s steps(30, end) 1.8s forwards, blinkCaret 0.7s step-end infinite;
        }
        @keyframes typing {
            from { width: 0; }
            to { width: 100%; }
        }
        @keyframes blinkCaret {
            from, to { border-color: transparent; }
            50% { border-color: var(--secondary); }
        }
        .tagline-wrapper {
            display: inline-block;
            max-width: 100%;
            margin-bottom: 10px;
        }

        /* ─ COLLAPSIBLE SECTIONS ─ */
        .section-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            cursor: pointer;
            width: 100%;
            margin-bottom: 10px;
            -webkit-user-select: none;
            user-select: none;
        }
        .section-header .section-label {
            margin-bottom: 0;
        }
        .section-toggle {
            width: 18px; height: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            border: 1px solid rgba(255,255,255,0.08);
            color: var(--text-muted);
            font-size: 0.55rem;
            transition: all 0.3s ease;
            flex-shrink: 0;
        }
        .section-header:hover .section-toggle {
            border-color: rgba(174,0,0,0.3);
            color: var(--secondary);
        }
        .section-toggle svg {
            width: 10px; height: 10px;
            stroke: currentColor;
            stroke-width: 2;
            fill: none;
            transition: transform 0.3s ease;
        }
        .section-header.collapsed .section-toggle svg {
            transform: rotate(-90deg);
        }
        .section-body {
            max-height: 2000px;
            overflow: hidden;
            transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
            opacity: 1;
            width: 100%;
        }
        .section-body.collapsed {
            max-height: 0;
            opacity: 0;
        }

        /* ─ PARTICLE CANVAS ─ */
        #bg-canvas {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            z-index: 0;
            pointer-events: none;
        }

        /* ─ CINEMATIC GRAIN ─ */
        .grain {
            position: fixed;
            top: -50%; left: -50%;
            width: 200%; height: 200%;
            z-index: 1;
            pointer-events: none;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
            animation: grain 0.8s steps(3) infinite;
            opacity: 0.2;
            will-change: transform;
        }
        @keyframes grain {
            0%, 100% { transform: translate(0,0); }
            20% { transform: translate(-5%,-10%); }
            40% { transform: translate(3%,-15%); }
            60% { transform: translate(12%,9%); }
            80% { transform: translate(-1%,7%); }
        }

        /* ─ SCAN LINE ─ */
        .scanline {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 2px;
            background: linear-gradient(90deg, transparent, var(--primary), transparent);
            z-index: 2;
            pointer-events: none;
            animation: scanMove 4s linear infinite;
            opacity: 0.08;
        }
        @keyframes scanMove {
            0% { top: -2px; }
            100% { top: 100vh; }
        }

        /* ─ VIGNETTE ─ */
        .vignette {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            background: radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.7) 100%);
            z-index: 1;
            pointer-events: none;
        }

        /* ─ MAIN CONTAINER ─ */
        .container {
            position: relative;
            z-index: 10;
            max-width: 480px;
            margin: 0 auto;
            padding: 60px 20px 80px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* ─ AVATAR ─ */
        .avatar-wrapper {
            position: relative;
            margin-bottom: 28px;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 0.6s forwards;
            animation-delay: 0s;
        }
        .avatar-ring {
            width: 120px; height: 120px;
            border-radius: 50%;
            padding: 3px;
            background: linear-gradient(135deg, var(--primary), rgba(174,0,0,0.3), var(--primary));
            box-shadow: 0 0 30px rgba(174,0,0,0.25), 0 0 60px rgba(174,0,0,0.08), inset 0 0 20px rgba(174,0,0,0.1);
            animation: ringGlow 4s ease-in-out infinite;
        }
        @keyframes ringGlow {
            0%, 100% { box-shadow: 0 0 30px rgba(174,0,0,0.25), 0 0 60px rgba(174,0,0,0.08); }
            50% { box-shadow: 0 0 40px rgba(174,0,0,0.4), 0 0 80px rgba(174,0,0,0.15), 0 0 120px rgba(174,0,0,0.05); }
        }
        .avatar-ring img {
            width: 100%; height: 100%;
            border-radius: 50%;
            object-fit: cover;
            display: block;
            border: 3px solid var(--bg-deep);
        }
        .avatar-pulse {
            position: absolute;
            top: -8px; left: -8px;
            right: -8px; bottom: -8px;
            border-radius: 50%;
            border: 1px solid var(--secondary);
            opacity: 0;
            animation: pulse 3s ease-out infinite;
        }
        .avatar-pulse:nth-child(2) { animation-delay: 1s; }
        .avatar-pulse:nth-child(3) { animation-delay: 2s; }
        @keyframes pulse {
            0% { transform: scale(1); opacity: 0.4; }
            100% { transform: scale(1.5); opacity: 0; }
        }

        /* ─ TITLE AREA ─ */
        .brand-name {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: clamp(0.85rem, 2.8vw, 1.4rem);
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            color: #ffffff;
            -webkit-text-fill-color: #ffffff;
            margin-bottom: 8px;
            text-align: center;
            position: relative;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 0.6s forwards;
            animation-delay: 0.15s;
        }
        .subtitle,
        .tagline-wrapper,
        .separator,
        .status-badge {
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 0.6s forwards;
            animation-delay: 0.25s;
        }
        .brand-name .glitch {
            position: relative;
            display: inline-block;
        }
        .brand-name .glitch::before,
        .brand-name .glitch::after {
            content: attr(data-text);
            position: absolute;
            top: 0; left: 0;
            width: 100%; height: 100%;
            opacity: 0;
        }
        .brand-name .glitch::before {
            color: var(--primary);
            animation: glitch1 3s infinite;
            clip-path: inset(0 0 65% 0);
        }
        .brand-name .glitch::after {
            color: var(--accent);
            animation: glitch2 3s infinite;
            clip-path: inset(35% 0 0 0);
        }
        @keyframes glitch1 {
            0%, 90%, 100% { opacity: 0; transform: translate(0); }
            91% { opacity: 0.8; transform: translate(-3px, -1px); }
            93% { opacity: 0.8; transform: translate(3px, 1px); }
            95% { opacity: 0; transform: translate(0); }
        }
        @keyframes glitch2 {
            0%, 88%, 100% { opacity: 0; transform: translate(0); }
            89% { opacity: 0.8; transform: translate(3px, 1px); }
            91% { opacity: 0.8; transform: translate(-3px, -1px); }
            93% { opacity: 0; transform: translate(0); }
        }

        .subtitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.7rem;
            font-weight: 500;
            letter-spacing: 0.35em;
            text-transform: uppercase;
            color: var(--secondary);
            margin-bottom: 8px;
            text-align: center;
            opacity: 0.9;
        }

        .tagline {
            font-family: 'Oswald', sans-serif;
            font-size: 0.85rem;
            font-weight: 300;
            letter-spacing: 0.15em;
            color: rgba(252,252,252,0.35);
            text-transform: uppercase;
            margin-bottom: 10px;
            text-align: center;
        }

        .separator {
            width: 60px;
            height: 1px;
            background: linear-gradient(90deg, transparent, var(--secondary), transparent);
            margin-bottom: 36px;
        }

        /* ─ SECTION LABEL ─ */
        .section-label {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: 0.55rem;
            font-weight: 700;
            letter-spacing: 0.25em;
            text-transform: uppercase;
            color: rgba(255,255,255,0.5);
            margin-bottom: 14px;
            text-align: left;
            width: 100%;
            padding-left: 2px;
        }

        /* ─ LINK CARDS ─ */
        .links {
            display: flex;
            flex-direction: column;
            gap: 10px;
            width: 100%;
            margin-bottom: 20px;
        }

        .link-card {
            position: relative;
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 16px 20px;
            background: var(--glass);
            border: 1px solid var(--glass-border);
            border-radius: 12px;
            text-decoration: none;
            color: var(--text);
            transition: all 0.3s ease;
            overflow: hidden;
            cursor: pointer;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
            opacity: 0;
            transform: translateY(20px);
            animation: fadeInUp 0.6s forwards;
        }
        .link-card:nth-child(1) { animation-delay: 0.06s; }
        .link-card:nth-child(2) { animation-delay: 0.12s; }
        .link-card:nth-child(3) { animation-delay: 0.18s; }
        .link-card:nth-child(4) { animation-delay: 0.24s; }
        .link-card:nth-child(5) { animation-delay: 0.30s; }
        .link-card:nth-child(6) { animation-delay: 0.36s; }
        .link-card:nth-child(7) { animation-delay: 0.42s; }
        .link-card:nth-child(8) { animation-delay: 0.48s; }
        .link-card:nth-child(9) { animation-delay: 0.54s; }
        .link-card:nth-child(10) { animation-delay: 0.60s; }
        .link-card:nth-child(11) { animation-delay: 0.66s; }
        .link-card:nth-child(12) { animation-delay: 0.72s; }

        @keyframes fadeInUp {
            to { opacity: 1; transform: translateY(0); }
        }

        .link-card::before {
            content: '';
            position: absolute;
            top: 8px; bottom: 8px; left: 0;
            width: 2px;
            background: var(--primary);
            border-radius: 0 2px 2px 0;
            opacity: 0;
            transform: scaleY(0);
            transition: opacity 0.3s ease, transform 0.3s ease;
        }
        .link-card:hover::before,
        .link-card:active::before {
            opacity: 1;
            transform: scaleY(1);
        }
        .link-card:hover {
            border-color: rgba(174,0,0,0.4);
            transform: translateY(-4px);
            box-shadow: 0 8px 30px rgba(174,0,0,0.2);
            background: rgba(255,255,255,0.04);
            color: var(--text-bright);
        }
        .link-card:active {
            transform: scale(0.98);
            transition-duration: 0.1s;
        }

        .link-icon {
            width: 38px;
            height: 38px;
            min-width: 38px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            font-size: 1.1rem;
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.05);
            transition: all 0.4s ease;
        }
        .link-card:hover .link-icon {
            background: rgba(174,0,0,0.1);
            border-color: rgba(174,0,0,0.3);
            box-shadow: 0 0 20px rgba(174,0,0,0.12);
        }

        .link-content {
            flex: 1;
            min-width: 0;
        }
        .link-title {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: 0.85rem;
            font-weight: 600;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            line-height: 1.3;
        }
        .link-desc {
            font-size: 0.65rem;
            font-weight: 400;
            letter-spacing: 0.05em;
            color: var(--text-muted);
            margin-top: 2px;
        }

        .link-arrow {
            font-size: 0.75rem;
            color: rgba(252,252,252,0.45);
            transition: all 0.4s ease;
        }
        .link-card:hover .link-arrow {
            color: var(--secondary);
            transform: translateX(3px);
        }

        /* ─ FEATURED CARD (CANDIDATURE) ─ */
        /* ─ CTA CANDIDATURE ─ */
        .cta-candidature {
            display: block;
            position: relative;
            border-radius: 14px;
            padding: 2px;
            text-decoration: none;
            overflow: hidden;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .cta-candidature:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 40px rgba(174,0,0,0.3);
        }
        .cta-candidature:active {
            transform: scale(0.98);
        }
        .cta-glow {
            position: absolute;
            inset: 0;
            border-radius: 14px;
            background: linear-gradient(135deg, #ae0000, #ff2222, #ae0000, #880000);
            background-size: 300% 300%;
            animation: ctaGlow 4s ease infinite;
        }
        @keyframes ctaGlow {
            0%, 100% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
        }
        .cta-inner {
            position: relative;
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 16px 18px;
            background: linear-gradient(135deg, #1a0808, #0f0505);
            border-radius: 12px;
        }
        .cta-left {
            flex-shrink: 0;
        }
        .cta-icon {
            width: 40px; height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: rgba(174,0,0,0.2);
            border: 1px solid rgba(174,0,0,0.3);
        }
        .cta-icon svg {
            width: 20px; height: 20px;
            fill: none;
            stroke: #ff4444;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        .cta-content {
            flex: 1;
            min-width: 0;
        }
        .cta-title {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: 0.85rem;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: #fff;
            line-height: 1.3;
        }
        .cta-subtitle {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.6rem;
            color: rgba(255,255,255,0.45);
            margin-top: 2px;
            letter-spacing: 0.02em;
        }
        .cta-arrow {
            flex-shrink: 0;
            width: 32px; height: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: rgba(174,0,0,0.25);
            transition: background 0.3s ease, transform 0.3s ease;
        }
        .cta-candidature:hover .cta-arrow {
            background: rgba(174,0,0,0.5);
            transform: translateX(3px);
        }
        .cta-arrow svg {
            width: 16px; height: 16px;
            fill: none;
            stroke: #ff4444;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        /* ─ CONSULTING CARD ─ */
        .link-card.consulting-card {
            background: linear-gradient(135deg, rgba(205,168,92,0.06), rgba(205,168,92,0.02));
            border: 1px solid rgba(205,168,92,0.2);
        }
        .link-card.consulting-card::before {
            background: #cda85c;
        }
        .link-card.consulting-card:hover {
            border-color: rgba(205,168,92,0.4);
            box-shadow: 0 2px 20px rgba(205,168,92,0.1);
        }

        /* ─ SOCIAL ROW ─ */
        .socials {
            display: flex;
            gap: 12px;
            margin-bottom: 40px;
        }
        .social-link {
            width: 44px; height: 44px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: var(--glass);
            border: 1px solid var(--glass-border);
            color: rgba(252,252,252,0.35);
            text-decoration: none;
            transition: all 0.4s ease;
            font-size: 1rem;
            -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
        }
        .social-link:hover {
            border-color: rgba(174,0,0,0.4);
            color: #ae0000;
            box-shadow: 0 0 24px rgba(174,0,0,0.25), 0 0 8px rgba(174,0,0,0.15);
            transform: translateY(-2px) scale(1.15);
        }

        /* ─ FOOTER ─ */
        .footer {
            text-align: center;
            opacity: 0.5;
            font-size: 0.6rem;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            font-family: 'Oswald', sans-serif;
        }

        /* ─ HOLOGRAPHIC BORDER ANIMATION ─ */
        .holo-line {
            width: 100%;
            height: 1px;
            background: linear-gradient(90deg, transparent, var(--primary), var(--secondary), var(--primary), transparent);
            background-size: 200% 100%;
            animation: holoShift 3s linear infinite;
            margin-bottom: 24px;
            opacity: 0.3;
        }
        @keyframes holoShift {
            0% { background-position: 0% 0%; }
            100% { background-position: 200% 0%; }
        }

        /* ─ RESPONSIVE ─ */
        @media (max-width: 520px) {
            .container {
                padding: 48px 16px 60px;
            }
            .brand-name { font-size: clamp(0.9rem, 5vw, 1.35rem); white-space: nowrap; }
            .link-card { padding: 14px 16px; }
        }

        /* ─ CURSOR GLOW (desktop) ─ */
        .cursor-glow {
            position: fixed;
            width: 300px; height: 300px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(174,0,0,0.07) 0%, transparent 70%);
            pointer-events: none;
            z-index: 3;
            transform: translate(-50%, -50%);
            transition: opacity 0.3s;
            opacity: 0;
        }
        body:hover .cursor-glow { opacity: 1; }

        /* ─ LOADING SCREEN ─ */
        /* ═══════════════════════════════════════════
           CINEMATIC LOADER - Film Production Intro
           ═══════════════════════════════════════════ */
        .loader {
            position: fixed;
            inset: 0;
            background: #000;
            z-index: 9999;
            overflow: hidden;
        }
        .loader.hidden { pointer-events: none; display: none; }

        /* Film grain overlay */
        .loader-grain {
            position: absolute; inset: 0;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");
            opacity: 0.4;
            z-index: 10;
            pointer-events: none;
            animation: grainShift 0.3s steps(3) infinite;
        }
        @keyframes grainShift {
            0% { transform: translate(0,0); }
            33% { transform: translate(-2px,1px); }
            66% { transform: translate(1px,-1px); }
        }

        /* Cinematic letterbox bars */
        .loader-bar-top, .loader-bar-bottom {
            position: absolute; left: 0; width: 100%; height: 0;
            background: #000; z-index: 8;
        }
        .loader-bar-top { top: 0; }
        .loader-bar-bottom { bottom: 0; }

        /* Red horizontal light streak */
        .loader-streak {
            position: absolute;
            top: 50%; left: -100%;
            width: 60%; height: 1px;
            background: linear-gradient(90deg, transparent, #ae0000 30%, #ff2222 50%, #ae0000 70%, transparent);
            z-index: 4;
            opacity: 0;
            box-shadow: 0 0 30px 8px rgba(174,0,0,0.4), 0 0 80px 20px rgba(174,0,0,0.15);
        }

        /* Center content */
        .loader-center {
            position: absolute; inset: 0;
            display: flex; flex-direction: column;
            align-items: center; justify-content: center;
            z-index: 5;
        }

        /* Logo */
        .loader-logo {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: clamp(1.8rem, 7vw, 3.5rem);
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.25em;
            color: #fff;
            opacity: 0;
            position: relative;
            overflow: hidden;
        }
        .loader-logo span {
            display: inline-block;
            opacity: 0;
        }

        /* Red line under logo */
        .loader-underline {
            width: 0;
            height: 2px;
            background: linear-gradient(90deg, transparent, #ae0000, #ff3333, #ae0000, transparent);
            margin-top: 0.8rem;
            box-shadow: 0 0 15px rgba(174,0,0,0.6);
        }

        /* Tagline */
        .loader-tagline {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.5rem;
            font-weight: 500;
            letter-spacing: 0.6em;
            text-transform: uppercase;
            color: rgba(255,255,255,0);
            margin-top: 1.2rem;
        }

        /* Vertical scan line */
        .loader-scan {
            position: absolute;
            top: 0; left: -2px;
            width: 2px; height: 100%;
            background: linear-gradient(180deg, transparent, rgba(174,0,0,0.3) 20%, rgba(255,255,255,0.08) 50%, rgba(174,0,0,0.3) 80%, transparent);
            z-index: 6;
            opacity: 0;
        }

        /* Lens flare */
        .loader-flare {
            position: absolute;
            width: 300px; height: 300px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(174,0,0,0.2) 0%, rgba(174,0,0,0.05) 30%, transparent 70%);
            z-index: 3;
            opacity: 0;
            top: 50%; left: 50%;
            transform: translate(-50%, -50%);
        }

        /* Horizontal glitch lines */
        .loader-glitch {
            position: absolute;
            left: 0; width: 100%;
            height: 1px;
            background: rgba(174,0,0,0.3);
            z-index: 7;
            opacity: 0;
        }

        /* Ember particles */
        .loader-ember {
            position: absolute;
            width: 1px; height: 1px;
            background: #ae0000;
            border-radius: 50%;
            z-index: 4;
            opacity: 0;
            box-shadow: 0 0 4px 1px rgba(174,0,0,0.6);
        }

        /* Aperture iris reveal */
        .loader-iris {
            position: absolute; inset: 0;
            z-index: 20;
            background: #000;
            clip-path: circle(0% at 50% 50%);
            pointer-events: none;
            opacity: 0;
        }

        /* Loader mobile fixes */
        @media (max-width: 600px) {
            .loader-logo {
                font-size: clamp(1.2rem, 6vw, 1.8rem) !important;
                letter-spacing: 0.12em !important;
            }
            .loader-tagline {
                font-size: 0.4rem;
                letter-spacing: 0.35em;
            }
            .loader-bar-top, .loader-bar-bottom {
                height: 0 !important;
            }
            .loader-flare {
                width: 180px; height: 180px;
            }
            .loader-grain {
                animation: none;
                opacity: 0.2;
            }
            .loader-streak {
                height: 1px;
                box-shadow: 0 0 15px 4px rgba(174,0,0,0.3);
            }
            .loader-underline {
                max-width: 60vw;
            }
        }

        /* ─ SVG ICONS ─ */
        .icon-svg {
            width: 18px; height: 18px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        /* ─ CUSTOM SCROLLBAR ─ */
        ::-webkit-scrollbar {
            width: 5px;
        }
        ::-webkit-scrollbar-track {
            background: #000000;
        }
        ::-webkit-scrollbar-thumb {
            background: rgba(174,0,0,0.4);
            border-radius: 10px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: rgba(174,0,0,0.7);
        }
        html {
            scrollbar-width: thin;
            scrollbar-color: rgba(174,0,0,0.4) #000000;
        }

        /* ─ 3D TILT ON CARDS ─ */
        .link-card {
            transform-style: preserve-3d;
            perspective: 800px;
        }

        /* ─ ICON HOVER ANIMATION ─ */
        .link-card:hover .link-icon .icon-svg {
            animation: iconBounce 0.4s ease;
        }
        @keyframes iconBounce {
            0% { transform: scale(1); }
            40% { transform: scale(1.25) rotate(-5deg); }
            70% { transform: scale(0.95) rotate(2deg); }
            100% { transform: scale(1) rotate(0deg); }
        }

        /* ─ MAGNETIC SOCIAL ICONS ─ */
        .social-link {
            transition: all 0.2s ease;
        }
        .social-link:hover .icon-svg {
            animation: iconSpin 0.5s ease;
        }
        @keyframes iconSpin {
            0% { transform: rotateY(0deg); }
            100% { transform: rotateY(360deg); }
        }

        /* ─ FOCUS STATES (Accessibility) ─ */
        .link-card:focus-visible,
        .social-link:focus-visible {
            outline: 2px solid var(--primary);
            outline-offset: 3px;
        }
        .section-header:focus-visible {
            outline: 1px solid rgba(174,0,0,0.5);
            outline-offset: 4px;
            border-radius: 8px;
        }

        /* QR code section removed - I9 */

        /* ═══════════════════════════════════════════
           FRONTEND DESIGN UPGRADES (A-F)
           ═══════════════════════════════════════════ */

        /* ─ A. AVATAR DISTINCTIF (hexagonal + duotone) ─ */
        .avatar-ring {
            clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
            border-radius: 0;
            width: 130px; height: 130px;
        }
        .avatar-ring img {
            clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
            border-radius: 0;
            border: none;
            filter: contrast(1.15) saturate(0.85);
        }
        .avatar-pulse {
            clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
            border-radius: 0;
        }
        @keyframes ringGlow {
            0%, 100% { box-shadow: 0 0 30px rgba(174,0,0,0.25), 0 0 60px rgba(174,0,0,0.08); filter: drop-shadow(0 0 12px rgba(174,0,0,0.2)); }
            50% { box-shadow: 0 0 40px rgba(174,0,0,0.4), 0 0 80px rgba(174,0,0,0.15); filter: drop-shadow(0 0 20px rgba(174,0,0,0.35)); }
        }

        /* ─ B+D. SEPARATEURS DE SECTION DISTINCTIFS ─ */
        .section-divider {
            width: 100%;
            height: 40px;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 12px 0 4px;
        }
        .section-divider::before {
            content: '';
            position: absolute;
            width: 100%;
            height: 1px;
            background: linear-gradient(90deg, transparent 0%, rgba(174,0,0,0.2) 20%, rgba(174,0,0,0.4) 50%, rgba(174,0,0,0.2) 80%, transparent 100%);
        }
        .section-divider-icon {
            position: relative;
            width: 28px; height: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--bg-deep);
            border: 1px solid rgba(174,0,0,0.2);
            border-radius: 6px;
            transform: rotate(45deg);
        }
        .section-divider-icon svg {
            width: 12px; height: 12px;
            stroke: rgba(174,0,0,0.5);
            fill: none;
            stroke-width: 2;
            transform: rotate(-45deg);
        }

        /* ─ B. ACCENTS COLORES PAR SECTION ─ */
        #section-protocoles .section-label { color: rgba(174,0,0,0.7); }
        #section-protocoles + .section-body .link-card:hover { border-color: rgba(174,0,0,0.5); box-shadow: 0 8px 30px rgba(174,0,0,0.2); }

        #section-services .section-label { color: rgba(205,168,92,0.7); }
        #section-services + .section-body .link-card:hover { border-color: rgba(205,168,92,0.4); box-shadow: 0 8px 30px rgba(205,168,92,0.15); }
        #section-services + .section-body .link-card:hover::before { background: #cda85c; }
        #section-services + .section-body .link-card:hover .link-icon { background: rgba(205,168,92,0.1); border-color: rgba(205,168,92,0.3); box-shadow: 0 0 20px rgba(205,168,92,0.12); }

        /* PROJETS & OUTILS - meme registre or que Services */
        #section-projets .section-label { color: rgba(205,168,92,0.7); }
        #section-projets + .section-body .link-card:hover { border-color: rgba(205,168,92,0.4); box-shadow: 0 8px 30px rgba(205,168,92,0.15); }
        #section-projets + .section-body .link-card:hover::before { background: #cda85c; }
        #section-projets + .section-body .link-card:hover .link-icon { background: rgba(205,168,92,0.1); border-color: rgba(205,168,92,0.3); box-shadow: 0 0 20px rgba(205,168,92,0.12); }
        /* Carte PHARE (produit vitrine mis en avant) */
        .link-card.featured-projet {
            background: linear-gradient(135deg, rgba(205,168,92,0.12), rgba(205,168,92,0.03));
            border: 1px solid rgba(205,168,92,0.38);
            box-shadow: 0 0 0 1px rgba(205,168,92,0.10), 0 6px 26px rgba(205,168,92,0.12);
        }
        .link-card.featured-projet::before { background: #cda85c; opacity: 1; transform: scaleY(1); }
        .link-card.featured-projet .link-icon {
            background: rgba(205,168,92,0.14);
            border-color: rgba(205,168,92,0.4);
            box-shadow: 0 0 18px rgba(205,168,92,0.14);
        }
        /* Badge PHARE or */
        .link-badge.phare {
            background: rgba(205,168,92,0.16);
            border: 1px solid rgba(205,168,92,0.45);
            color: #cda85c;
            animation: badgePulseGold 2.5s ease-in-out infinite;
        }
        @keyframes badgePulseGold {
            0%, 100% { box-shadow: 0 0 0 rgba(205,168,92,0); }
            50% { box-shadow: 0 0 9px rgba(205,168,92,0.5); }
        }

        /* Reflets DA Lynks.Pro (violet #56468b + corail #db8274) sur SA carte
           uniquement (scope data-money="lynkspro"), en plus du traitement or PHARE
           deja en place. Reste sobre : un halo discret derriere l'icone + une
           touche de couleur au survol, jamais une deuxieme DA qui casse le
           rouge/or du site. */
        .link-card.featured-projet[data-money="lynkspro"] .link-icon {
            box-shadow: 0 0 18px rgba(205,168,92,0.14), 0 0 22px rgba(86,70,139,0.22), 0 0 26px rgba(219,130,116,0.14);
        }
        .link-card.featured-projet[data-money="lynkspro"]:hover {
            border-color: rgba(205,168,92,0.45);
            box-shadow: 0 8px 30px rgba(174,0,0,0.12), 0 0 32px rgba(86,70,139,0.18), 0 0 18px rgba(219,130,116,0.1);
        }
        .link-card.featured-projet[data-money="lynkspro"]:hover .link-icon {
            background: rgba(205,168,92,0.16);
            border-color: rgba(205,168,92,0.45);
            box-shadow: 0 0 20px rgba(205,168,92,0.16), 0 0 26px rgba(86,70,139,0.26), 0 0 30px rgba(219,130,116,0.16);
        }
        .link-card.featured-projet[data-money="lynkspro"] .link-badge.phare {
            background: linear-gradient(90deg, rgba(205,168,92,0.18), rgba(86,70,139,0.2));
            border-color: rgba(205,168,92,0.45);
        }

        #section-medias .section-label { color: rgba(255,255,255,0.7); }

        /* ─ D. BREATH MOMENTS (citations entre sections) ─ */
        .breath-moment {
            width: 100%;
            text-align: center;
            padding: 28px 16px;
            margin: 8px 0;
            position: relative;
        }
        .breath-quote {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: 0.65rem;
            font-weight: 600;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: rgba(174,0,0,0.5);
            line-height: 1.8;
        }
        .breath-stat {
            font-family: 'Benzin', 'Oswald', sans-serif;
            font-size: 1.8rem;
            font-weight: 800;
            color: rgba(255,255,255,0.08);
            letter-spacing: 0.05em;
            line-height: 1;
            margin-bottom: 4px;
        }
        .breath-label {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.5rem;
            letter-spacing: 0.3em;
            text-transform: uppercase;
            color: rgba(255,255,255,0.25);
        }

        /* ─ E. LINK-ARROW MICRO-ANIMATION (remplace la fleche statique) ─ */
        .link-arrow {
            width: 20px;
            height: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: rgba(255,255,255,0.03);
            border: 1px solid rgba(255,255,255,0.06);
            transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
            font-size: 0;
            flex-shrink: 0;
        }
        .link-arrow::after {
            content: '';
            width: 5px; height: 5px;
            border-right: 1.5px solid rgba(252,252,252,0.35);
            border-top: 1.5px solid rgba(252,252,252,0.35);
            transform: rotate(45deg);
            transition: all 0.4s ease;
        }
        .link-card:hover .link-arrow {
            background: rgba(174,0,0,0.15);
            border-color: rgba(174,0,0,0.4);
            transform: translateX(0) scale(1.15);
        }
        .link-card:hover .link-arrow::after {
            border-color: #ff4444;
        }
        #section-services + .section-body .link-card:hover .link-arrow {
            background: rgba(205,168,92,0.15);
            border-color: rgba(205,168,92,0.4);
        }
        #section-services + .section-body .link-card:hover .link-arrow::after {
            border-color: #cda85c;
        }
        #section-projets + .section-body .link-card:hover .link-arrow {
            background: rgba(205,168,92,0.15);
            border-color: rgba(205,168,92,0.4);
        }
        #section-projets + .section-body .link-card:hover .link-arrow::after {
            border-color: #cda85c;
        }

        /* ─ F. SHIMMER SUR CARTES FEATURED ─ */
        .cta-candidature::after,
        .cta-wd::after {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 60%; height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
            z-index: 2;
            animation: shimmerSweep 4s ease-in-out infinite;
            pointer-events: none;
        }
        .cta-wd::after {
            background: linear-gradient(90deg, transparent, rgba(205,168,92,0.08), transparent);
            animation-delay: 2s;
        }
        @keyframes shimmerSweep {
            0%, 100% { left: -100%; }
            50% { left: 150%; }
        }

        /* ─ A. SOCIALS EN GRILLE 2 COLONNES ─ */
        .socials {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 8px;
        }
        .social-link {
            width: auto; height: auto;
            padding: 10px;
            border-radius: 10px;
            flex-direction: column;
            gap: 4px;
        }
        .social-link-name {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.45rem;
            letter-spacing: 0.08em;
            color: rgba(255,255,255,0.3);
            text-transform: uppercase;
        }

        /* ─ D. ESPACEMENT DYNAMIQUE ENTRE SECTIONS ─ */
        .links { margin-bottom: 8px; }
        .section-header { margin-top: 8px; }

        /* ─ WD FEATURED CTA (gold theme) ─ */
        .cta-wd {
            display: block;
            position: relative;
            border-radius: 14px;
            padding: 2px;
            text-decoration: none;
            overflow: hidden;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .cta-wd:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 40px rgba(205,168,92,0.3);
        }
        .cta-wd:active {
            transform: scale(0.98);
        }
        .cta-wd .cta-glow {
            background: linear-gradient(135deg, #cda85c, #e0c48a, #cda85c, #a07830);
            background-size: 300% 300%;
            animation: ctaGlow 4s ease infinite;
        }
        .cta-wd .cta-inner {
            position: relative;
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 16px 18px;
            background: linear-gradient(135deg, #1a1508, #0f0d05);
            border-radius: 12px;
        }
        .cta-wd .cta-icon {
            background: rgba(205,168,92,0.15);
            border-color: rgba(205,168,92,0.3);
        }
        .cta-wd .cta-icon svg {
            color: #cda85c;
            stroke: #cda85c;
        }
        .cta-wd .cta-arrow {
            background: rgba(205,168,92,0.2);
        }
        .cta-wd .cta-arrow svg {
            stroke: #cda85c;
        }
        .cta-wd .cta-title {
            font-family: 'Benzin', 'Oswald', sans-serif;
        }
        .cta-wd .cta-subtitle {
            font-family: 'Montserrat', sans-serif;
        }
        .cta-wd .places-badge {
            background: rgba(205,168,92,0.1);
            border-color: rgba(205,168,92,0.2);
            color: #cda85c;
        }
        .cta-wd .places-dot {
            background: #cda85c;
            box-shadow: 0 0 6px #cda85c;
        }

        /* ─ UPDATED FOOTER ─ */
        .footer-updated {
            font-size: 0.55rem;
            color: var(--text-muted);
            letter-spacing: 0.15em;
            margin-top: 4px;
        }

        /* ─ SCROLL PROGRESS BAR ─ */
        .scroll-progress {
            position: fixed;
            top: 0; left: 0;
            height: 2px;
            width: 0%;
            background: linear-gradient(90deg, var(--primary), #ff1a1a);
            z-index: 9998;
            transition: width 0.1s linear;
        }

        /* ─ BACK TO TOP ─ */
        .back-to-top {
            position: fixed;
            bottom: 28px; right: 28px;
            width: 40px; height: 40px;
            border-radius: 50%;
            background: rgba(174,0,0,0.15);
            border: 1px solid rgba(174,0,0,0.3);
            color: var(--text);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            z-index: 100;
            opacity: 0;
            transform: translateY(20px);
            transition: all 0.4s ease;
            pointer-events: none;
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
        }
        .back-to-top.visible {
            opacity: 1;
            transform: translateY(0);
            pointer-events: auto;
        }
        .back-to-top:hover {
            background: rgba(174,0,0,0.35);
            border-color: rgba(174,0,0,0.6);
            box-shadow: 0 0 20px rgba(174,0,0,0.2);
        }
        .back-to-top svg {
            width: 16px; height: 16px;
            stroke: currentColor;
            stroke-width: 2;
            fill: none;
        }

        /* ─ SHARE BUTTON ─ */
        .share-btn {
            position: fixed;
            bottom: 28px; left: 28px;
            width: 40px; height: 40px;
            border-radius: 50%;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            color: var(--text-muted);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            z-index: 100;
            transition: all 0.4s ease;
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
        }
        .share-btn:hover {
            background: rgba(174,0,0,0.15);
            border-color: rgba(174,0,0,0.3);
            color: var(--text-bright);
        }
        .share-btn svg {
            width: 16px; height: 16px;
            stroke: currentColor;
            stroke-width: 2;
            fill: none;
        }
        .share-toast {
            position: fixed;
            bottom: 80px; left: 28px;
            padding: 6px 14px;
            background: rgba(174,0,0,0.9);
            color: #fff;
            font-size: 0.6rem;
            font-family: 'Montserrat', sans-serif;
            letter-spacing: 0.1em;
            border-radius: 6px;
            z-index: 101;
            opacity: 0;
            transform: translateY(8px);
            transition: all 0.3s ease;
            pointer-events: none;
        }
        .share-toast.show {
            opacity: 1;
            transform: translateY(0);
        }

        /* gradientBorder removed - replaced by cta-candidature design */

        /* ─ PLACES COUNTER BADGE ─ */
        .places-badge {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 2px 8px;
            background: rgba(174,0,0,0.2);
            border: 1px solid rgba(174,0,0,0.35);
            border-radius: 4px;
            font-size: 0.55rem;
            font-family: 'Oswald', sans-serif;
            letter-spacing: 0.1em;
            color: #ff4444;
            margin-top: 3px;
            animation: urgencyPulse 2s ease-in-out infinite;
        }
        .places-dot {
            width: 5px; height: 5px;
            border-radius: 50%;
            background: #ff4444;
            animation: statusPulse 1.5s ease-in-out infinite;
        }
        @keyframes urgencyPulse {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.7; }
        }

        /* ─ SKIP TO CONTENT ─ */
        .skip-link {
            position: fixed;
            top: -100px; left: 50%;
            transform: translateX(-50%);
            background: var(--primary);
            color: #fff;
            padding: 8px 20px;
            border-radius: 0 0 8px 8px;
            font-size: 0.7rem;
            font-family: 'Montserrat', sans-serif;
            z-index: 10000;
            transition: top 0.3s ease;
            text-decoration: none;
        }
        .skip-link:focus {
            top: 0;
        }

        /* ─ SCROLL REVEAL SECTIONS ─ */
        .section-reveal {
            opacity: 0;
            transform: translateY(40px) scale(0.97);
            filter: blur(4px);
            transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                        transform 0.8s cubic-bezier(0.16, 1, 0.3, 1),
                        filter 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .section-reveal.visible {
            opacity: 1;
            transform: translateY(0) scale(1);
            filter: blur(0);
        }

        /* ─ ANNOUNCEMENT BANNER ─ */
        .announcement-bar {
            position: fixed;
            top: 2px; left: 0;
            width: 100%;
            z-index: 9997;
            background: linear-gradient(90deg, rgba(174,0,0,0.9), rgba(120,0,0,0.9));
            -webkit-backdrop-filter: blur(10px);
            backdrop-filter: blur(10px);
            padding: 8px 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            font-size: 0.65rem;
            font-family: 'Montserrat', sans-serif;
            letter-spacing: 0.08em;
            color: #fff;
            transform: translateY(-100%);
            animation: slideDown 0.5s 2s forwards;
            overflow: hidden;
        }
        .announcement-bar .ann-slide {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            white-space: nowrap;
            animation: annFadeIn 0.4s ease;
        }
        @keyframes annFadeIn {
            0% { opacity: 0; transform: translateY(8px); }
            100% { opacity: 1; transform: translateY(0); }
        }
        .announcement-bar a {
            color: #fff;
            text-decoration: underline;
            font-weight: 600;
        }
        .announcement-close {
            position: absolute;
            right: 12px;
            background: none;
            border: none;
            color: rgba(255,255,255,0.6);
            cursor: pointer;
            font-size: 1rem;
            line-height: 1;
            padding: 4px;
        }
        .announcement-close:hover { color: #fff; }
        @keyframes slideDown {
            to { transform: translateY(0); }
        }

        /* ─ EMAIL CAPTURE ─ */
        .email-section {
            width: 100%;
            margin-bottom: 32px;
        }
        .email-card {
            background: var(--glass);
            border: 1px solid var(--glass-border);
            border-radius: 12px;
            padding: 24px 20px;
            text-align: center;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
        }
        .email-card h2,
        .email-card h3 {
            font-family: 'Oswald', sans-serif;
            font-size: 0.85rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--text-bright);
            margin-bottom: 6px;
        }
        .email-card p {
            font-size: 0.65rem;
            color: var(--text-muted);
            margin-bottom: 16px;
        }
        .email-form {
            display: flex;
            gap: 8px;
            max-width: 380px;
            margin: 0 auto;
        }
        .email-input {
            flex: 1;
            padding: 10px 14px;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 8px;
            color: var(--text);
            font-family: 'Montserrat', sans-serif;
            font-size: 0.7rem;
            outline: none;
            transition: border-color 0.3s;
        }
        .email-input:focus {
            border-color: rgba(174,0,0,0.4);
        }
        .email-input::placeholder {
            color: var(--text-muted);
        }
        .email-submit {
            padding: 10px 20px;
            background: var(--primary);
            border: none;
            border-radius: 8px;
            color: #fff;
            font-family: 'Oswald', sans-serif;
            font-size: 0.65rem;
            letter-spacing: 0.15em;
            text-transform: uppercase;
            cursor: pointer;
            transition: all 0.3s;
            white-space: nowrap;
        }
        .email-submit:hover {
            background: #cc0000;
            box-shadow: 0 0 20px rgba(174,0,0,0.3);
        }
        .email-success {
            display: none;
            font-size: 0.65rem;
            color: #22c55e;
            margin-top: 10px;
        }

        /* ─ LINK BADGES ─ */
        .link-badge {
            display: inline-block;
            padding: 1px 6px;
            border-radius: 3px;
            font-size: 0.45rem;
            font-family: 'Oswald', sans-serif;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            font-weight: 600;
            vertical-align: middle;
            margin-left: 6px;
        }
        .link-badge.new {
            background: rgba(34,197,94,0.15);
            border: 1px solid rgba(34,197,94,0.3);
            color: #22c55e;
        }
        .link-badge.hot {
            background: rgba(239,68,68,0.15);
            border: 1px solid rgba(239,68,68,0.3);
            color: #ef4444;
            animation: urgencyPulse 2s ease-in-out infinite;
        }
        .link-badge.live {
            background: rgba(168,85,247,0.15);
            border: 1px solid rgba(168,85,247,0.3);
            color: #a855f7;
            animation: urgencyPulse 1.5s ease-in-out infinite;
        }

        /* ─ MEDIA EMBEDS ─ */
        .embed-section {
            width: 100%;
            margin-bottom: 16px;
        }
        .embed-card {
            background: var(--glass);
            border: 1px solid var(--glass-border);
            border-radius: 12px;
            overflow: hidden;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
        }
        .embed-card iframe {
            width: 100%;
            border: none;
            display: block;
        }
        .embed-label {
            font-family: 'Oswald', sans-serif;
            font-size: 0.5rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: rgba(255,255,255,0.2);
            text-align: left;
            margin-bottom: 8px;
            padding-left: 2px;
        }

        /* ─ YOUTUBE VIDEO CARD ─ */
        .yt-video-card {
            display: block;
            position: relative;
            width: 100%;
            aspect-ratio: 16 / 9;
            border-radius: 12px;
            overflow: hidden;
            background: #000;
            text-decoration: none;
        }
        .yt-video-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.4s ease, filter 0.4s ease;
        }
        .yt-video-card:hover img,
        .yt-video-card:active img {
            transform: scale(1.03);
            filter: brightness(0.7);
        }
        .yt-play-btn {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 64px;
            height: 64px;
            background: rgba(174, 0, 0, 0.9);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: transform 0.3s ease, background 0.3s ease;
            box-shadow: 0 0 30px rgba(174, 0, 0, 0.4);
        }
        .yt-play-btn svg {
            width: 24px;
            height: 24px;
            fill: #fff;
            margin-left: 3px;
        }
        .yt-video-card:hover .yt-play-btn {
            transform: translate(-50%, -50%) scale(1.1);
            background: rgba(174, 0, 0, 1);
        }
        .yt-video-title {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 24px 16px 14px;
            background: linear-gradient(transparent, rgba(0,0,0,0.85));
            font-family: 'Oswald', sans-serif;
            font-size: 0.7rem;
            letter-spacing: 0.05em;
            color: #fff;
            text-transform: uppercase;
        }
        .yt-subscribe-bar {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 12px;
            background: var(--glass);
            border: 1px solid var(--glass-border);
            border-top: none;
            border-radius: 0 0 12px 12px;
            text-decoration: none;
            transition: background 0.3s ease;
        }
        .yt-subscribe-bar:hover {
            background: rgba(174, 0, 0, 0.1);
        }
        .yt-subscribe-bar svg {
            width: 18px;
            height: 18px;
            fill: #ae0000;
        }
        .yt-subscribe-bar span {
            font-family: 'Oswald', sans-serif;
            font-size: 0.6rem;
            letter-spacing: 0.15em;
            text-transform: uppercase;
            color: var(--primary);
        }

        /* ─ YOUTUBE CAROUSEL ─ */
        .yt-carousel-wrapper {
            position: relative;
        }
        .yt-carousel {
            display: flex;
            gap: 12px;
            overflow-x: auto;
            scroll-snap-type: x mandatory;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            padding: 2px 0;
        }
        .yt-carousel::-webkit-scrollbar { display: none; }
        .yt-carousel .yt-video-card {
            min-width: 280px;
            max-width: 280px;
            flex-shrink: 0;
            scroll-snap-align: start;
            aspect-ratio: 16 / 9;
        }
        /* Carte La Mue - pleine largeur, pas contrainte par le carousel */
        .mue-video-card {
            width: 100%;
            min-width: unset;
            max-width: unset;
            flex-shrink: unset;
            scroll-snap-align: unset;
            border-radius: 14px;
        }
        .mue-video-card img {
            object-position: center center;
        }
        .yt-carousel-arrow {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            z-index: 5;
            width: 32px; height: 32px;
            border-radius: 50%;
            border: 1px solid rgba(255,255,255,0.15);
            background: rgba(0,0,0,0.7);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background 0.3s, border-color 0.3s;
            -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
        }
        .yt-carousel-arrow:hover {
            background: rgba(174,0,0,0.5);
            border-color: rgba(174,0,0,0.4);
        }
        .yt-carousel-arrow svg {
            width: 16px; height: 16px;
            fill: none;
            stroke: #fff;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        .yt-arrow-left { left: -4px; }
        .yt-arrow-right { right: -4px; }

        /* ─ TESTIMONIALS (WhatsApp style) ─ */
        .testimonials-section {
            width: 100%;
            margin-bottom: 32px;
            overflow: hidden;
        }
        .testimonial-track {
            display: flex;
            gap: 14px;
            overflow-x: auto;
            scroll-snap-type: x mandatory;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            padding: 4px 2px 16px;
        }
        .testimonial-track::-webkit-scrollbar { display: none; }
        .testimonial-card {
            min-width: 270px;
            max-width: 270px;
            background: #1a2e1a;
            border: none;
            border-radius: 0 12px 12px 12px;
            padding: 14px 16px 10px;
            flex-shrink: 0;
            scroll-snap-align: center;
            position: relative;
            box-shadow: 0 2px 8px rgba(0,0,0,0.3);
        }
        .testimonial-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: -6px;
            width: 0;
            height: 0;
            border-top: 0 solid transparent;
            border-right: 6px solid #1a2e1a;
            border-bottom: 8px solid transparent;
        }
        .testimonial-text {
            font-size: 0.7rem;
            color: #e9e9e9;
            line-height: 1.55;
            margin-bottom: 6px;
            font-style: normal;
            opacity: 1;
        }
        .testimonial-meta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-top: 4px;
        }
        .testimonial-author {
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .testimonial-avatar {
            width: 24px; height: 24px;
            border-radius: 50%;
            background: linear-gradient(135deg, #2a5a2a, #3d8a3d);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 0.5rem;
            font-weight: 700;
            color: #fff;
        }
        .testimonial-name {
            font-size: 0.55rem;
            letter-spacing: 0;
            color: #8fbc8f;
            font-weight: 600;
        }
        .testimonial-role {
            font-size: 0.45rem;
            color: rgba(255,255,255,0.35);
        }
        .testimonial-time {
            font-size: 0.45rem;
            color: rgba(255,255,255,0.55);
            white-space: nowrap;
        }
        .testimonial-confidential {
            text-align: center;
            font-size: 0.45rem;
            color: rgba(255,255,255,0.25);
            letter-spacing: 0.15em;
            text-transform: uppercase;
            margin-top: 6px;
            padding-top: 6px;
        }

        /* ─ LINK THUMBNAILS ─ */
        .link-thumb {
            width: 42px; height: 42px;
            min-width: 42px;
            border-radius: 8px;
            object-fit: cover;
            border: 1px solid var(--glass-border);
        }

        /* ─ CALENDLY EMBED ─ */
        .calendly-section {
            width: 100%;
            margin-bottom: 24px;
        }
        .calendly-card {
            background: var(--glass);
            border: 1px solid var(--glass-border);
            border-radius: 12px;
            padding: 20px;
            text-align: center;
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
        }
        .calendly-card h3 {
            font-family: 'Oswald', sans-serif;
            font-size: 0.8rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--text-bright);
            margin-bottom: 6px;
        }
        .calendly-card p {
            font-size: 0.6rem;
            color: var(--text-muted);
            margin-bottom: 14px;
        }
        .calendly-btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 10px 24px;
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.1);
            border-radius: 8px;
            color: var(--text);
            font-family: 'Oswald', sans-serif;
            font-size: 0.65rem;
            letter-spacing: 0.15em;
            text-transform: uppercase;
            text-decoration: none;
            cursor: pointer;
            transition: all 0.3s;
        }
        .calendly-btn:hover {
            background: rgba(174,0,0,0.15);
            border-color: rgba(174,0,0,0.3);
            box-shadow: 0 0 20px rgba(174,0,0,0.15);
        }
        .calendly-btn svg {
            width: 14px; height: 14px;
            stroke: currentColor;
            stroke-width: 2;
            fill: none;
        }

        /* ─ CUSTOM CURSOR ─ */
        @media (pointer: fine) {
            /* cursor: none removed for accessibility - M6 */
            .custom-cursor {
                position: fixed;
                top: 0; left: 0;
                width: 8px; height: 8px;
                background: #fff;
                border-radius: 50%;
                pointer-events: none;
                z-index: 99999;
                transition: width 0.2s, height 0.2s, background 0.2s, transform 0.08s linear;
                transform: translate(-50%, -50%);
                mix-blend-mode: difference;
            }
            .custom-cursor.active {
                width: 32px; height: 32px;
                background: rgba(174,0,0,0.35);
                border: 1px solid rgba(174,0,0,0.5);
            }
            .custom-cursor-ring {
                position: fixed;
                top: 0; left: 0;
                width: 36px; height: 36px;
                border: 1px solid rgba(255,255,255,0.15);
                border-radius: 50%;
                pointer-events: none;
                z-index: 99998;
                transition: width 0.3s, height 0.3s, border-color 0.3s, transform 0.15s ease-out;
                transform: translate(-50%, -50%);
            }
            .custom-cursor-ring.active {
                width: 48px; height: 48px;
                border-color: rgba(174,0,0,0.25);
            }
        }

        /* ─ RIPPLE EFFECT ─ */
        .link-card {
            overflow: hidden;
        }
        .ripple {
            position: absolute;
            border-radius: 50%;
            background: rgba(174,0,0,0.25);
            transform: scale(0);
            animation: rippleAnim 0.6s ease-out;
            pointer-events: none;
        }
        @keyframes rippleAnim {
            to { transform: scale(4); opacity: 0; }
        }

        /* ─ CARD HOVER GLOW ─ */
        .link-card::after {
            content: '';
            position: absolute;
            inset: -1px;
            border-radius: 13px;
            opacity: 0;
            background: radial-gradient(600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(174,0,0,0.12), transparent 40%);
            transition: opacity 0.3s;
            pointer-events: none;
            z-index: 0;
        }
        .link-card:hover::after {
            opacity: 1;
        }

        /* ─ STAGGERED CARD ENTRANCE ─ */
        .link-card {
            opacity: 0;
            transform: translateY(20px);
        }
        .link-card.card-visible {
            animation: cardEntrance 0.5s ease forwards;
        }
        @keyframes cardEntrance {
            to { opacity: 1; transform: translateY(0); }
        }

        /* ─ INTERACTIVE AVATAR ─ */
        .avatar-ring {
            cursor: pointer;
            transition: transform 0.4s ease;
        }
        .avatar-ring.clicked {
            animation: avatarBurst 0.6s ease;
        }
        @keyframes avatarBurst {
            0% { transform: scale(1); }
            30% { transform: scale(1.08); }
            60% { transform: scale(0.97); }
            100% { transform: scale(1); }
        }
        /* 7e clic : revelation de l'Ombre (flash or -> rouge) */
        .avatar-ring.reveal { animation: avatarReveal 0.9s cubic-bezier(0.2,0.8,0.2,1); }
        @keyframes avatarReveal {
            0%   { filter: drop-shadow(0 0 4px rgba(205,168,92,0.6)); transform: scale(1); }
            25%  { filter: drop-shadow(0 0 30px rgba(255,60,60,0.95)); transform: scale(1.1); }
            55%  { filter: drop-shadow(0 0 16px rgba(205,168,92,0.85)); transform: scale(0.98); }
            100% { filter: drop-shadow(0 0 0 rgba(205,168,92,0)); transform: scale(1); }
        }
        /* Indice de retour (mode masque) */
        .avatar-hint {
            position: absolute; left: 50%; bottom: -18px; transform: translateX(-50%);
            white-space: nowrap; font-family: 'Montserrat', sans-serif; font-size: 0.58rem;
            letter-spacing: 0.14em; text-transform: uppercase; color: #cda85c;
            background: rgba(0,0,0,0.55); border: 1px solid rgba(205,168,92,0.3);
            padding: 3px 9px; border-radius: 999px; pointer-events: none;
            opacity: 0; transition: opacity 0.4s ease; z-index: 120;
        }
        .avatar-hint.show { opacity: 1; }
        @media (prefers-reduced-motion: reduce) {
            .avatar-ring.reveal { animation: none; }
        }

        /* ─ MODE OMBRE (mask-live) : ambiance sanglante + video de fond ─ */
        .shadow-video {
            position: fixed; inset: 0; width: 100%; height: 100%;
            object-fit: cover; z-index: 1; pointer-events: none;
            opacity: 0; transition: opacity 1.1s ease;
            filter: saturate(1.05) contrast(1.06);
        }
        .shadow-veil {
            position: fixed; inset: 0; z-index: 2; pointer-events: none;
            opacity: 0; transition: opacity 1.1s ease;
            background:
                radial-gradient(120% 85% at 50% -5%, rgba(150,0,0,0.4), transparent 60%),
                linear-gradient(180deg, rgba(24,0,0,0.5), rgba(6,0,0,0.82));
        }
        body.mask-live .shadow-video { opacity: 0.5; }
        body.mask-live .shadow-veil { opacity: 1; }
        body.mask-live { background: #050000; }
        /* Boutons / accents dores -> rouge sang */
        body.mask-live .vcard-btn {
            background: linear-gradient(135deg, #ae0000, #7a0000);
            color: #ffe9e9;
            box-shadow: 0 6px 22px rgba(174,0,0,0.5);
        }
        body.mask-live .vcard-btn:hover { box-shadow: 0 10px 30px rgba(255,40,40,0.55); }
        body.mask-live .spot__cta { background: linear-gradient(135deg, #ff3b3b, #ae0000); color: #1a0303; }
        body.mask-live .spot__card { border-color: rgba(174,0,0,0.5); background: linear-gradient(135deg, rgba(174,0,0,0.28), rgba(70,0,0,0.12)); }
        body.mask-live .spot__badge { color: #ff6b6b; border-color: rgba(174,0,0,0.55); }
        body.mask-live .spot__lbl { color: rgba(255,80,80,0.6); }
        body.mask-live #section-projets .section-label,
        body.mask-live #section-services .section-label { color: rgba(255,70,70,0.82); }
        body.mask-live .link-badge.phare {
            background: rgba(174,0,0,0.2); border-color: rgba(255,70,70,0.5); color: #ff6b6b;
            animation: badgePulseHot 2s ease-in-out infinite;
        }
        body.mask-live .link-card.featured-projet {
            background: linear-gradient(135deg, rgba(174,0,0,0.16), rgba(174,0,0,0.04));
            border-color: rgba(174,0,0,0.42);
            box-shadow: 0 0 0 1px rgba(174,0,0,0.14), 0 6px 26px rgba(174,0,0,0.16);
        }
        body.mask-live .link-card.featured-projet::before { background: #ff3b3b; }
        body.mask-live #section-projets + .section-body .link-card:hover,
        body.mask-live #section-services + .section-body .link-card:hover {
            border-color: rgba(174,0,0,0.5); box-shadow: 0 8px 30px rgba(174,0,0,0.25);
        }
        body.mask-live #section-projets + .section-body .link-card:hover::before,
        body.mask-live #section-services + .section-body .link-card:hover::before { background: #ff3b3b; }
        body.mask-live .sound-toggle.active { color: #ff4444; }
        body.mask-live .status-badge { border-color: rgba(174,0,0,0.4); }
        body.mask-live .lm__btn { background: linear-gradient(135deg, #ae0000, #7a0000); color: #ffe9e9; }
        body.mask-live .lm__buybtn { border-color: rgba(174,0,0,0.55); color: #ff6b6b; }
        body.mask-live .lm__buybtn:hover { background: rgba(174,0,0,0.14); }
        body.mask-live .email-submit { background: linear-gradient(135deg, #ae0000, #7a0000); color: #ffe9e9; }
        body.mask-live .cta-wd .cta-glow { background: linear-gradient(135deg, #ae0000, #ff2222, #ae0000, #660000); }
        body.mask-live .cta-wd .cta-icon svg { stroke: #ff6b6b; }
        body.mask-live .lm { border-color: rgba(174,0,0,0.35); background: linear-gradient(135deg, rgba(174,0,0,0.12), rgba(80,0,0,0.06)); }
        @media (prefers-reduced-motion: reduce) {
            .shadow-video, .shadow-veil { transition: none; }
        }

        /* ─ BACKGROUND COLOR SHIFT ─ */
        .bg-shift {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            pointer-events: none;
            z-index: 0;
            opacity: 0;
            transition: opacity 0.5s ease;
            background: radial-gradient(ellipse at 50% 0%, rgba(174,0,0,0.04), transparent 70%);
        }

        /* ─ TEXT REVEAL ─ */
        .letter-reveal {
            display: inline-block;
            opacity: 0;
            transform: translateY(12px);
            animation: letterIn 0.4s ease forwards;
        }
        @keyframes letterIn {
            to { opacity: 1; transform: translateY(0); }
        }

        /* ─ HOLO-LINE GLOW ─ */
        .holo-line.section-reveal.visible {
            animation: holoGlow 1.5s ease forwards;
        }
        @keyframes holoGlow {
            0% { opacity: 0; box-shadow: none; }
            50% { opacity: 1; box-shadow: 0 0 12px rgba(174,0,0,0.3); }
            100% { opacity: 1; box-shadow: none; }
        }

        /* ─ TEXT SELECTION ─ */
        ::selection {
            background: rgba(174,0,0,0.35);
            color: #fff;
        }
        ::-moz-selection {
            background: rgba(174,0,0,0.35);
            color: #fff;
        }

        /* ─ SOUND TOGGLE ─ */
        .sound-toggle {
            position: fixed;
            bottom: 24px;
            left: 72px;
            width: 40px; height: 40px;
            border-radius: 50%;
            background: var(--glass);
            border: 1px solid var(--glass-border);
            -webkit-backdrop-filter: blur(12px);
            backdrop-filter: blur(12px);
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 9990;
            cursor: pointer;
            transition: all 0.3s;
            color: var(--text-muted);
        }
        .sound-toggle:hover {
            border-color: rgba(174,0,0,0.3);
            color: var(--text-bright);
            box-shadow: 0 0 20px rgba(174,0,0,0.15);
        }
        .sound-toggle.active {
            border-color: rgba(174,0,0,0.4);
            color: var(--primary);
            box-shadow: 0 0 12px rgba(174,0,0,0.2);
        }
        .sound-toggle svg {
            width: 16px; height: 16px;
            stroke: currentColor;
            stroke-width: 2;
            fill: none;
        }
        .sound-wave {
            position: absolute;
            width: 40px; height: 40px;
            border-radius: 50%;
            border: 1px solid rgba(174,0,0,0.2);
            pointer-events: none;
            opacity: 0;
        }
        .sound-toggle.active .sound-wave {
            animation: soundPulse 2s ease-out infinite;
        }
        @keyframes soundPulse {
            0% { transform: scale(1); opacity: 0.4; }
            100% { transform: scale(1.8); opacity: 0; }
        }

        /* Bug button next to sound toggle */
        /* Desktop: share(28) + sound(72) + bug(120) -each 40px wide, 8px gap */
        #as-bug-widget {
            bottom: 24px !important;
            left: 120px !important;
            right: auto !important;
        }
        @media (max-width: 768px) {
            #as-bug-widget {
                bottom: 16px !important;
                left: 118px !important;
                right: auto !important;
            }
        }
        @media (max-width: 600px) {
            #as-bug-widget {
                bottom: 76px !important;
                left: 118px !important;
                right: auto !important;
            }
            #as-bug-panel {
                left: 0 !important;
                right: auto !important;
            }
        }

        /* ─ VERIFIED BADGE ─ */
        .avatar-wrapper {
            position: relative;
        }
        .verified-badge {
            position: absolute;
            bottom: 4px;
            right: 4px;
            width: 26px; height: 26px;
            background: #1da1f2;
            border-radius: 50%;
            border: 3px solid #000;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 100;
            isolation: isolate;
            animation: verifiedPop 0.4s cubic-bezier(0.34,1.56,0.64,1) 2s both;
            pointer-events: none;
        }
        .verified-badge svg {
            width: 14px; height: 14px;
            stroke: #fff;
            stroke-width: 3;
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        /* Badge verifie inline, a cote du nom */
        .brand-name .name-verified {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 0.9em; height: 0.9em;
            margin-left: 0.42em;
            background: #1da1f2;
            border-radius: 50%;
            vertical-align: middle;
            position: relative;
            top: -0.05em;
            -webkit-text-fill-color: initial;
            animation: verifiedPop 0.4s cubic-bezier(0.34,1.56,0.64,1) 0.55s both;
        }
        .brand-name .name-verified svg {
            width: 60%; height: 60%;
            stroke: #fff;
            stroke-width: 3.2;
            fill: none;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        @keyframes verifiedPop {
            0% { transform: scale(0); opacity: 0; }
            100% { transform: scale(1); opacity: 1; }
        }

        /* featured card styles replaced by .cta-candidature */

        /* ─ NEON GLOW BRAND NAME ─ */
        .brand-name .glitch {
            text-shadow:
                0 0 7px rgba(174,0,0,0.3),
                0 0 20px rgba(174,0,0,0.15),
                0 0 42px rgba(174,0,0,0.08);
            animation: neonPulse 3s ease-in-out infinite alternate;
        }
        @keyframes neonPulse {
            0% { text-shadow: 0 0 7px rgba(174,0,0,0.3), 0 0 20px rgba(174,0,0,0.15), 0 0 42px rgba(174,0,0,0.08); }
            100% { text-shadow: 0 0 10px rgba(174,0,0,0.5), 0 0 30px rgba(174,0,0,0.25), 0 0 60px rgba(174,0,0,0.12); }
        }

        /* ─ ANIMATED SVG ICONS ON HOVER ─ */
        .link-card:hover .icon-svg,
        .link-card:hover .link-thumb {
            animation: iconBounce 0.4s ease;
        }
        .social-link:hover .icon-svg {
            animation: iconSpin 0.5s ease;
        }
        @keyframes iconBounce {
            0% { transform: scale(1); }
            40% { transform: scale(1.25); }
            70% { transform: scale(0.9); }
            100% { transform: scale(1); }
        }
        @keyframes iconSpin {
            0% { transform: rotate(0deg) scale(1); }
            50% { transform: rotate(15deg) scale(1.15); }
            100% { transform: rotate(0deg) scale(1); }
        }

        /* ─ PAGE EXIT TRANSITION ─ */
        .page-exit {
            position: fixed;
            inset: 0;
            background: #000;
            z-index: 99999;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.35s ease;
        }
        .page-exit.active {
            opacity: 1;
            pointer-events: all;
        }

        /* ─ MORPHING BACKGROUND BLOBS ─ */
        .morph-blob {
            position: fixed;
            border-radius: 50%;
            filter: blur(60px);
            pointer-events: none;
            z-index: 0;
            opacity: 0.3;
            will-change: transform;
        }
        .morph-blob-1 {
            width: 300px; height: 300px;
            background: radial-gradient(circle, rgba(174,0,0,0.08), transparent 70%);
            top: 10%; left: -8%;
            animation: blobFloat1 18s ease-in-out infinite;
        }
        .morph-blob-2 {
            width: 250px; height: 250px;
            background: radial-gradient(circle, rgba(100,0,0,0.06), transparent 70%);
            bottom: 20%; right: -5%;
            animation: blobFloat2 22s ease-in-out infinite;
        }
        @keyframes blobFloat1 {
            0%, 100% { transform: translate(0, 0) scale(1); }
            33% { transform: translate(30px, 40px) scale(1.1); }
            66% { transform: translate(-20px, 20px) scale(0.9); }
        }
        @keyframes blobFloat2 {
            0%, 100% { transform: translate(0, 0) scale(1); }
            33% { transform: translate(-25px, -30px) scale(1.15); }
            66% { transform: translate(15px, -15px) scale(0.85); }
        }

        /* ─ FLOATING AVATAR PARTICLES ─ */
        .avatar-particle {
            position: absolute;
            width: 3px; height: 3px;
            background: rgba(174,0,0,0.5);
            border-radius: 50%;
            pointer-events: none;
            animation: avatarFloat 4s ease-in-out infinite;
        }
        @keyframes avatarFloat {
            0%, 100% { opacity: 0; transform: translate(0, 0) scale(0); }
            20% { opacity: 0.6; transform: scale(1); }
            80% { opacity: 0.3; }
            100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0); }
        }

        /* ─ MOBILE TOUCH PRESS STATES ─ */
        @media (pointer: coarse) {
            .link-card:active {
                transform: scale(0.97) !important;
                transition: transform 0.1s ease !important;
            }
            .social-link:active {
                transform: scale(0.88) !important;
            }
            .email-submit:active, .calendly-btn:active {
                transform: scale(0.95) !important;
            }
            .section-header:active {
                opacity: 0.7;
            }
        }

        /* ─ BOTTOM QUICK-NAV (mobile) ─ */
        .bottom-nav {
            display: none;
        }
        @media (max-width: 600px) {
            .bottom-nav {
                display: flex;
                position: fixed;
                bottom: 0; left: 0;
                width: 100%;
                z-index: 9995;
                background: rgba(0,0,0,0.85);
                -webkit-backdrop-filter: blur(16px);
                backdrop-filter: blur(16px);
                border-top: 1px solid rgba(255,255,255,0.06);
                padding: 6px 0 calc(6px + env(safe-area-inset-bottom, 0px));
                justify-content: space-around;
                align-items: center;
            }
            .bottom-nav a {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 2px;
                text-decoration: none;
                color: var(--text-muted);
                font-size: 0.45rem;
                font-family: 'Montserrat', sans-serif;
                letter-spacing: 0.05em;
                padding: 4px 8px;
                border-radius: 8px;
                transition: color 0.2s;
                -webkit-tap-highlight-color: transparent;
            }
            .bottom-nav a:active {
                color: var(--primary);
            }
            .bottom-nav svg {
                width: 18px; height: 18px;
                stroke: currentColor;
                stroke-width: 1.5;
                fill: none;
            }
            /* Push content above bottom nav */
            .footer { padding-bottom: 70px !important; }
            .back-to-top { bottom: 76px !important; }
            .share-btn { bottom: 76px !important; }
            .sound-toggle { bottom: 76px !important; }
        }

        /* ─ INSTALL PWA BANNER ─ */
        .pwa-banner {
            display: none;
            position: fixed;
            bottom: 60px; left: 12px; right: 12px;
            z-index: 9996;
            background: rgba(10,10,10,0.95);
            -webkit-backdrop-filter: blur(16px);
            backdrop-filter: blur(16px);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 14px;
            padding: 16px;
            align-items: center;
            gap: 12px;
            font-family: 'Montserrat', sans-serif;
            animation: slideUp 0.4s ease;
        }
        .pwa-banner.show { display: flex; }
        .pwa-banner-icon {
            width: 44px; height: 44px;
            min-width: 44px;
            border-radius: 10px;
            background: linear-gradient(135deg, #ae0000, #660000);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
        }
        .pwa-banner-text {
            flex: 1;
        }
        .pwa-banner-title {
            font-family: 'Oswald', sans-serif;
            font-size: 0.7rem;
            letter-spacing: 0.1em;
            color: var(--text-bright);
            margin-bottom: 2px;
        }
        .pwa-banner-desc {
            font-size: 0.55rem;
            color: var(--text-muted);
        }
        .pwa-banner-btn {
            padding: 8px 16px;
            background: var(--primary);
            border: none;
            border-radius: 8px;
            color: #fff;
            font-family: 'Oswald', sans-serif;
            font-size: 0.6rem;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            white-space: nowrap;
            cursor: pointer;
        }
        .pwa-banner-close {
            position: absolute;
            top: 6px; right: 10px;
            background: none;
            border: none;
            color: var(--text-muted);
            font-size: 0.9rem;
            cursor: pointer;
            padding: 4px;
        }
        @keyframes slideUp {
            from { transform: translateY(30px); opacity: 0; }
            to { transform: translateY(0); opacity: 1; }
        }

        /* ─ SWIPEABLE TESTIMONIALS (mobile) ─ */
        @media (max-width: 600px) {
            .testimonial-card {
                min-width: 82vw;
                max-width: 82vw;
            }
        }
        .testimonial-dots {
            display: flex;
            justify-content: center;
            gap: 6px;
            margin-top: 8px;
        }
        .testimonial-dot {
            width: 6px; height: 6px;
            border-radius: 50%;
            background: rgba(255,255,255,0.15);
            transition: all 0.3s;
        }
        .testimonial-dot.active {
            background: var(--primary);
            width: 18px;
            border-radius: 3px;
        }

        /* ─ STICKY SECTION LABELS ─ */
        @media (max-width: 600px) {
            .section-header {
                position: sticky;
                top: 0;
                z-index: 50;
                background: rgba(0,0,0,0.85);
                -webkit-backdrop-filter: blur(12px);
                backdrop-filter: blur(12px);
                margin-left: -20px;
                margin-right: -20px;
                padding: 10px 20px;
                border-bottom: 1px solid rgba(255,255,255,0.04);
            }
        }

        /* ─ MOBILE PERF: disable heavy effects ─ */
        @media (max-width: 600px) {
            .grain, .scanline, .morph-blob, .cursor-glow {
                display: none !important;
            }
            #bg-canvas {
                opacity: 0.3 !important;
            }
            .avatar-particle {
                display: none !important;
            }
        }

        /* ─ MOBILE SPACING & TAP TARGETS ─ */
        @media (max-width: 600px) {
            body {
                padding-left: env(safe-area-inset-left, 0px);
                padding-right: env(safe-area-inset-right, 0px);
            }
            .container {
                padding: 30px 16px 40px;
            }
            .link-card {
                min-height: 56px;
                padding: 14px 14px !important;
            }
            .link-title {
                font-size: 0.68rem !important;
            }
            .social-link {
                width: 44px !important;
                height: 44px !important;
            }
            .email-form {
                flex-direction: column;
            }
            .email-submit {
                width: 100%;
                padding: 12px;
            }
            .announcement-bar {
                font-size: 0.55rem;
                padding: 6px 32px 6px 12px;
            }
            .embed-card iframe {
                height: 180px !important;
            }
            .calendly-card {
                padding: 16px;
            }
        }

        /* ─ LANDSCAPE MODE ─ */
        @media (max-height: 500px) and (orientation: landscape) {
            .container {
                max-width: 520px;
                padding: 20px 16px;
            }
            .avatar-wrapper {
                transform: scale(0.7);
                margin-bottom: -10px;
            }
            .brand-name { font-size: 1.2rem !important; }
            .link-card { min-height: auto; padding: 10px 12px !important; }
            .bottom-nav { padding: 4px 0; }
            .bottom-nav svg { width: 14px; height: 14px; }
            .announcement-bar { display: none; }
        }

        /* ─ SAFE AREA (iPhone notch) ─ */
        @supports (padding: env(safe-area-inset-bottom)) {
            .bottom-nav {
                padding-bottom: calc(6px + env(safe-area-inset-bottom));
            }
        }

        /* ─ CINEMATIC ENHANCEMENTS ─ */

        /* Light sweep on cards */
        .link-card::after {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 60%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.03), transparent);
            transform: skewX(-20deg);
            transition: left 0.6s ease;
            pointer-events: none;
        }
        .link-card:hover::after {
            left: 150%;
        }

        /* Holographic avatar ring */
        .avatar-ring {
            animation: ringGlow 4s ease-in-out infinite, holoShift 8s linear infinite;
        }
        @keyframes holoShift {
            0%, 100% { filter: hue-rotate(0deg); }
            25% { filter: hue-rotate(-10deg); }
            50% { filter: hue-rotate(5deg); }
            75% { filter: hue-rotate(-5deg); }
        }

        /* Animated gradient on section labels */
        .section-label {
            background: linear-gradient(90deg, rgba(255,255,255,0.2), rgba(174,0,0,0.4), rgba(255,255,255,0.2));
            background-size: 200% 100%;
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: labelShine 6s ease-in-out infinite;
        }
        @keyframes labelShine {
            0%, 100% { background-position: -200% center; }
            50% { background-position: 200% center; }
        }

        /* Depth shadow on cards when scrolling */
        .link-card {
            box-shadow: 0 2px 10px rgba(0,0,0,0.3), 0 0 1px rgba(174,0,0,0.1);
        }
        .link-card:hover {
            box-shadow: 0 8px 32px rgba(174,0,0,0.15), 0 0 1px rgba(174,0,0,0.3);
        }

        /* CTA breathing glow */
        .cta-candidature::after {
            content: '';
            position: absolute;
            inset: -20px;
            border-radius: 24px;
            background: radial-gradient(ellipse, rgba(174,0,0,0.15), transparent 70%);
            animation: ctaBreathe 3s ease-in-out infinite;
            pointer-events: none;
            z-index: -1;
        }
        @keyframes ctaBreathe {
            0%, 100% { opacity: 0.5; transform: scale(0.95); }
            50% { opacity: 1; transform: scale(1.05); }
        }

        /* Horizontal red line accents */
        .section-header::after {
            content: '';
            position: absolute;
            bottom: -2px;
            left: 0; right: 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(174,0,0,0.3), transparent);
        }
        .section-header {
            position: relative;
            padding-bottom: 8px;
        }

        /* Testimonial card glow */
        .testimonial-card {
            box-shadow: 0 4px 20px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.03);
            transition: box-shadow 0.4s ease, transform 0.4s ease;
        }

        /* Email section cinematic border */
        .email-card {
            position: relative;
            overflow: hidden;
        }
        .email-card::before {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 100%; height: 2px;
            background: linear-gradient(90deg, transparent, #ae0000, transparent);
            animation: emailScan 4s linear infinite;
        }
        @keyframes emailScan {
            0% { left: -100%; }
            100% { left: 100%; }
        }

        /* Social icons pulse on scroll */
        .social-link {
            transition: all 0.3s ease, box-shadow 0.3s ease;
        }
        .social-link:hover {
            box-shadow: 0 0 20px rgba(174,0,0,0.3);
            transform: translateY(-3px);
        }

        /* Ambient red glow behind hero */
        .avatar-wrapper::before {
            content: '';
            position: absolute;
            top: 50%; left: 50%;
            width: 300px; height: 300px;
            transform: translate(-50%, -50%);
            background: radial-gradient(circle, rgba(174,0,0,0.12) 0%, transparent 70%);
            animation: ambientPulse 5s ease-in-out infinite;
            pointer-events: none;
            z-index: -1;
        }
        @keyframes ambientPulse {
            0%, 100% { opacity: 0.6; transform: translate(-50%, -50%) scale(1); }
            50% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
        }

        /* Footer slogan cinematic */
        .footer-slogan {
            background: linear-gradient(90deg, rgba(255,255,255,0.3), rgba(255,255,255,0.7), rgba(255,255,255,0.3));
            background-size: 200% 100%;
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            animation: sloganShine 4s ease-in-out infinite;
        }
        @keyframes sloganShine {
            0%, 100% { background-position: -200% center; }
            50% { background-position: 200% center; }
        }

        /* ─ BADGE PULSE GLOW ─ */
        .link-badge {
            animation: badgePulse 2.5s ease-in-out infinite;
        }
        .link-badge.hot {
            animation: badgePulseHot 2s ease-in-out infinite;
        }
        .link-badge.new {
            animation: badgePulseNew 2.5s ease-in-out infinite;
        }
        @keyframes badgePulse {
            0%, 100% { box-shadow: 0 0 0 rgba(174,0,0,0); }
            50% { box-shadow: 0 0 8px rgba(174,0,0,0.4); }
        }
        @keyframes badgePulseHot {
            0%, 100% { box-shadow: 0 0 0 rgba(255,68,68,0); filter: brightness(1); }
            50% { box-shadow: 0 0 12px rgba(255,68,68,0.5); filter: brightness(1.3); }
        }
        @keyframes badgePulseNew {
            0%, 100% { box-shadow: 0 0 0 rgba(34,197,94,0); }
            50% { box-shadow: 0 0 10px rgba(34,197,94,0.4); }
        }

        /* ─ SOCIAL ICONS FLOAT/ORBIT ─ */
        @keyframes socialFloat {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-4px); }
        }
        .social-link:nth-child(1) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 0s; }
        .social-link:nth-child(2) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 0.3s; }
        .social-link:nth-child(3) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 0.6s; }
        .social-link:nth-child(4) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 0.9s; }
        .social-link:nth-child(5) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 1.2s; }
        .social-link:nth-child(6) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 1.5s; }
        .social-link:nth-child(7) { animation: socialFloat 3s ease-in-out infinite; animation-delay: 1.8s; }

        /* ─ 3D TILT ON AVATAR ─ */
        .avatar-wrapper {
            perspective: 600px;
            transform-style: preserve-3d;
        }
        .avatar-ring {
            transform-style: preserve-3d;
            transition: transform 0.15s ease-out;
        }

        /* ─ SECTION WIPE ─ */
        .section-header {
            overflow: hidden;
        }
        .section-header::before {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 100%; height: 100%;
            background: linear-gradient(90deg, transparent, rgba(174,0,0,0.06), transparent);
            transition: left 0s;
            pointer-events: none;
        }
        .section-header.wipe-active::before {
            left: 100%;
            transition: left 0.8s ease-out;
        }

        /* ─ EASTER EGG RAGE MODE ─ */
        body.rage-mode {
            animation: rageShake 0.1s linear infinite;
        }
        body.rage-mode .bg-image {
            opacity: 0.15 !important;
            filter: hue-rotate(0deg) saturate(3);
        }
        body.rage-mode .scanline {
            opacity: 0.3 !important;
            animation-duration: 1s !important;
        }
        body.rage-mode .grain {
            opacity: 0.5 !important;
        }
        body.rage-mode .avatar-ring {
            animation: rageRing 0.3s linear infinite !important;
        }
        body.rage-mode .brand-name .glitch::before,
        body.rage-mode .brand-name .glitch::after {
            animation-duration: 0.2s !important;
            opacity: 1 !important;
        }
        body.rage-mode .link-card {
            border-color: rgba(255,0,0,0.3) !important;
        }
        body.rage-mode .vignette {
            background: radial-gradient(ellipse at center, transparent 30%, rgba(174,0,0,0.4) 100%) !important;
        }
        @keyframes rageShake {
            0%, 100% { transform: translate(0); }
            25% { transform: translate(-2px, 1px); }
            50% { transform: translate(2px, -1px); }
            75% { transform: translate(-1px, -2px); }
        }
        @keyframes rageRing {
            0%, 100% { box-shadow: 0 0 30px rgba(255,0,0,0.6), 0 0 60px rgba(255,0,0,0.3); }
            50% { box-shadow: 0 0 50px rgba(255,0,0,0.8), 0 0 100px rgba(255,0,0,0.4); }
        }

        /* ─ 1. CARD STAGGER ENTRANCE - unique per card ─ */
        .link-card {
            opacity: 0;
            transform: translateY(30px);
        }
        .link-card.card-visible {
            opacity: 1;
            transform: translateY(0);
        }
        /* Entrance A: slide from left */
        .link-card.entrance-a.card-visible {
            animation: entrA 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes entrA {
            0% { opacity: 0; transform: translateX(-50px) scale(0.95); }
            100% { opacity: 1; transform: translateX(0) scale(1); }
        }
        /* Entrance B: slide from right */
        .link-card.entrance-b.card-visible {
            animation: entrB 0.65s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes entrB {
            0% { opacity: 0; transform: translateX(50px) scale(0.95); }
            100% { opacity: 1; transform: translateX(0) scale(1); }
        }
        /* Entrance C: scale up from center */
        .link-card.entrance-c.card-visible {
            animation: entrC 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes entrC {
            0% { opacity: 0; transform: scale(0.7); }
            100% { opacity: 1; transform: scale(1); }
        }
        /* Entrance D: fade up with rotation */
        .link-card.entrance-d.card-visible {
            animation: entrD 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes entrD {
            0% { opacity: 0; transform: translateY(40px) rotate(-2deg); }
            100% { opacity: 1; transform: translateY(0) rotate(0); }
        }
        /* Entrance E: clip reveal from left */
        .link-card.entrance-e.card-visible {
            animation: entrE 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes entrE {
            0% { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-20px); }
            100% { opacity: 1; clip-path: inset(0 0 0 0); transform: translateX(0); }
        }
        /* Entrance F: drop from above */
        .link-card.entrance-f.card-visible {
            animation: entrF 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes entrF {
            0% { opacity: 0; transform: translateY(-30px) scale(0.95); }
            100% { opacity: 1; transform: translateY(0) scale(1); }
        }
        /* Entrance G: flip in */
        .link-card.entrance-g.card-visible {
            animation: entrG 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes entrG {
            0% { opacity: 0; transform: translateX(30px) rotateY(12deg); }
            100% { opacity: 1; transform: translateX(0) rotateY(0); }
        }
        /* Entrance H: scale + slight rotation */
        .link-card.entrance-h.card-visible {
            animation: entrH 0.65s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes entrH {
            0% { opacity: 0; transform: scale(0.8) rotate(1deg); }
            100% { opacity: 1; transform: scale(1) rotate(0); }
        }

        /* ─ 2. TYPEWRITER SUBTITLE ─ */
        .subtitle {
            opacity: 0;
            animation: subtitleReveal 1.2s ease 2.2s forwards;
        }
        @keyframes subtitleReveal {
            0% { opacity: 0; letter-spacing: 0.8em; transform: translateY(20px); }
            100% { opacity: 0.9; letter-spacing: 0.35em; transform: translateY(0); }
        }

        /* ─ 5. ICON BOUNCE ON APPEAR ─ */
        .link-card.card-visible .link-icon {
            animation: iconBounce 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes iconBounce {
            0% { transform: scale(0); }
            60% { transform: scale(1.15); }
            100% { transform: scale(1); }
        }

        /* ─ 9. ANIMATED ICONS ─ */
        .link-icon .icon-svg {
            animation: iconFloat 3s ease-in-out infinite;
        }
        @keyframes iconFloat {
            0%, 100% { transform: translateY(0) rotate(0deg); }
            25% { transform: translateY(-2px) rotate(2deg); }
            75% { transform: translateY(1px) rotate(-1deg); }
        }

        /* ─ 10. HOVER GRADIENT SWEEP ─ */
        .link-card::before {
            content: '';
            position: absolute;
            top: 0; left: -100%;
            width: 100%; height: 100%;
            background: linear-gradient(90deg, transparent, rgba(174,0,0,0.06), rgba(205,168,92,0.04), transparent);
            transition: left 0.5s ease;
            pointer-events: none;
            z-index: 0;
            border-radius: inherit;
        }
        .link-card:hover::before {
            left: 100%;
        }

        /* ─ 11. DISPONIBLE BADGE HEARTBEAT ─ */
        .status-dot {
            animation: statusHeartbeat 2s ease-in-out infinite !important;
        }
        @keyframes statusHeartbeat {
            0%, 100% { transform: scale(1); box-shadow: 0 0 8px rgba(34,197,94,0.5); }
            15% { transform: scale(1.4); box-shadow: 0 0 16px rgba(34,197,94,0.8); }
            30% { transform: scale(1); box-shadow: 0 0 8px rgba(34,197,94,0.5); }
            45% { transform: scale(1.25); box-shadow: 0 0 12px rgba(34,197,94,0.7); }
        }

        /* ─ 12. FLOATING GOLDEN DOTS ─ */
        .floating-dot {
            position: fixed;
            width: 3px; height: 3px;
            border-radius: 50%;
            background: var(--accent);
            opacity: 0;
            pointer-events: none;
            z-index: 2;
            animation: dotDrift 8s ease-in-out infinite;
        }
        @keyframes dotDrift {
            0% { opacity: 0; transform: translateY(0) translateX(0); }
            20% { opacity: 0.4; }
            50% { opacity: 0.6; transform: translateY(-60px) translateX(15px); }
            80% { opacity: 0.3; }
            100% { opacity: 0; transform: translateY(-120px) translateX(-10px); }
        }

        /* ─ 14. SECTION DIVIDER DRAW ─ */
        .section-header::before {
            content: '';
            position: absolute;
            bottom: 0; left: 50%;
            width: 0; height: 1px;
            background: linear-gradient(90deg, transparent, var(--primary), transparent);
            transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1), left 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        }
        .section-header.divider-drawn::before {
            width: 100%;
            left: 0;
        }

        /* ─ 15. ORBIT DOTS AROUND AVATAR ─ */
        .orbit-dot {
            position: absolute;
            width: 4px; height: 4px;
            border-radius: 50%;
            background: var(--primary);
            box-shadow: 0 0 6px rgba(174,0,0,0.6);
            pointer-events: none;
        }
        .orbit-container {
            position: absolute;
            top: 50%; left: 50%;
            width: 160px; height: 160px;
            margin-top: -80px;
            margin-left: -80px;
            pointer-events: none;
            z-index: 1;
        }

        /* ─ 21. CONFETTI ON EMAIL SUCCESS ─ */
        .confetti-particle {
            position: fixed;
            width: 6px; height: 6px;
            pointer-events: none;
            z-index: 10000;
            border-radius: 1px;
        }

        /* ─ 23. ACTIVE NAV PULSE ─ */
        @media (max-width: 600px) {
            .bottom-nav a.nav-active {
                color: var(--primary) !important;
            }
            .bottom-nav a.nav-active svg {
                filter: drop-shadow(0 0 6px rgba(174,0,0,0.5));
                animation: navPulse 0.4s ease;
            }
            @keyframes navPulse {
                0% { transform: scale(1); }
                50% { transform: scale(1.3); }
                100% { transform: scale(1); }
            }
        }

        /* ─ 24. SUCCESS CHECKMARK ─ */
        .email-success {
            display: none;
            font-size: 0.65rem;
            color: #22c55e;
            margin-top: 10px;
            text-align: center;
        }
        .success-check {
            display: inline-block;
            width: 40px; height: 40px;
            border-radius: 50%;
            background: rgba(34,197,94,0.1);
            border: 2px solid #22c55e;
            margin-bottom: 8px;
            position: relative;
            animation: checkPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
        }
        .success-check::after {
            content: '';
            position: absolute;
            top: 10px; left: 9px;
            width: 10px; height: 18px;
            border: solid #22c55e;
            border-width: 0 2.5px 2.5px 0;
            transform: rotate(45deg);
            animation: checkDraw 0.3s ease 0.3s both;
        }
        @keyframes checkPop {
            0% { transform: scale(0); opacity: 0; }
            100% { transform: scale(1); opacity: 1; }
        }
        @keyframes checkDraw {
            0% { clip-path: inset(0 0 100% 0); }
            100% { clip-path: inset(0 0 0 0); }
        }

        /* ─ 26. DYNAMIC GREETING ─ */
        .greeting-text {
            font-family: 'Montserrat', sans-serif;
            font-size: 0.5rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--accent);
            opacity: 0.6;
            margin-bottom: 4px;
            animation: greetFade 1s ease 2.5s both;
        }
        @keyframes greetFade {
            from { opacity: 0; transform: translateY(-5px); }
            to { opacity: 0.6; transform: translateY(0); }
        }

        /* ─ MONEY CARD UNIQUE ENTRANCES ─ */
        /* Consulting: slide from left + golden glow */
        .link-card[data-money="consulting"].card-visible {
            animation: moneySlideLeft 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes moneySlideLeft {
            0% { opacity: 0; transform: translateX(-60px) scale(0.95); }
            100% { opacity: 1; transform: translateX(0) scale(1); }
        }
        .link-card[data-money="consulting"].card-visible .link-icon {
            animation: iconGoldPulse 0.8s ease 0.3s both;
        }
        @keyframes iconGoldPulse {
            0% { transform: scale(0); box-shadow: 0 0 0 rgba(205,168,92,0); }
            50% { transform: scale(1.2); box-shadow: 0 0 25px rgba(205,168,92,0.4); }
            100% { transform: scale(1); box-shadow: 0 0 0 rgba(205,168,92,0); }
        }

        /* Monster Start: flip in from right */
        .link-card[data-money="start"].card-visible {
            animation: moneyFlipRight 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes moneyFlipRight {
            0% { opacity: 0; transform: translateX(60px) rotateY(15deg); }
            100% { opacity: 1; transform: translateX(0) rotateY(0); }
        }
        .link-card[data-money="start"].card-visible .link-icon {
            animation: iconSpin 0.6s ease 0.2s both;
        }
        @keyframes iconSpin {
            0% { transform: scale(0) rotate(-180deg); }
            100% { transform: scale(1) rotate(0deg); }
        }

        /* Monster Studio: scale up with red burst */
        .link-card[data-money="studio"].card-visible {
            animation: moneyScaleBurst 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes moneyScaleBurst {
            0% { opacity: 0; transform: scale(0.5); }
            60% { opacity: 1; transform: scale(1.03); box-shadow: 0 0 30px rgba(174,0,0,0.3); }
            100% { transform: scale(1); box-shadow: none; }
        }
        .link-card[data-money="studio"].card-visible .link-icon {
            animation: iconShake 0.5s ease 0.4s both;
        }
        @keyframes iconShake {
            0%, 100% { transform: scale(1) rotate(0); }
            20% { transform: scale(1.1) rotate(-5deg); }
            40% { transform: scale(1.1) rotate(5deg); }
            60% { transform: scale(1.1) rotate(-3deg); }
            80% { transform: scale(1.05) rotate(2deg); }
        }

        /* Monster Site: slide up with layers effect */
        .link-card[data-money="site"].card-visible {
            animation: moneyRiseUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes moneyRiseUp {
            0% { opacity: 0; transform: translateY(50px) scale(0.9); }
            50% { box-shadow: 0 10px 30px rgba(174,0,0,0.2); }
            100% { opacity: 1; transform: translateY(0) scale(1); box-shadow: none; }
        }
        .link-card[data-money="site"].card-visible .link-icon {
            animation: iconStack 0.6s ease 0.3s both;
        }
        @keyframes iconStack {
            0% { transform: scale(0) translateY(10px); }
            50% { transform: scale(1.15) translateY(-3px); }
            100% { transform: scale(1) translateY(0); }
        }

        /* Masterclass: cinematic wipe from left */
        .link-card[data-money="masterclass"].card-visible {
            animation: moneyWipe 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes moneyWipe {
            0% { opacity: 0; clip-path: inset(0 100% 0 0); transform: translateX(-20px); }
            100% { opacity: 1; clip-path: inset(0 0 0 0); transform: translateX(0); }
        }
        .link-card[data-money="masterclass"].card-visible .link-icon {
            animation: iconRecord 0.6s ease 0.4s both;
        }
        @keyframes iconRecord {
            0% { transform: scale(0); }
            50% { transform: scale(1.2); box-shadow: 0 0 15px rgba(174,0,0,0.5); }
            70% { transform: scale(0.9); }
            100% { transform: scale(1); }
        }

        /* Devis: slide from right + green glow */
        .link-card[data-money="devis"].card-visible {
            animation: moneySlideRight 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
        }
        @keyframes moneySlideRight {
            0% { opacity: 0; transform: translateX(50px) scale(0.95); }
            100% { opacity: 1; transform: translateX(0) scale(1); }
        }
        .link-card[data-money="devis"].card-visible .link-icon {
            animation: iconGreenPulse 0.7s ease 0.3s both;
        }
        @keyframes iconGreenPulse {
            0% { transform: scale(0); box-shadow: 0 0 0 rgba(37,211,102,0); }
            50% { transform: scale(1.15); box-shadow: 0 0 20px rgba(37,211,102,0.4); }
            100% { transform: scale(1); box-shadow: 0 0 0 rgba(37,211,102,0); }
        }

        /* ─ 30. BREATHING BACKGROUND ─ */
        .breathing-bg {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            pointer-events: none;
            z-index: 0;
            background: radial-gradient(ellipse at center, rgba(174,0,0,0.03) 0%, transparent 70%);
            animation: breathe 8s ease-in-out infinite;
        }
        @keyframes breathe {
            0%, 100% { opacity: 0.3; transform: scale(1); }
            50% { opacity: 1; transform: scale(1.08); }
        }

        /* ─ AMBIENT GRADIENT ORB ─ */
        .ambient-orb {
            position: fixed;
            width: 600px;
            height: 600px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(174,0,0,0.06) 0%, rgba(174,0,0,0.02) 40%, transparent 70%);
            pointer-events: none;
            z-index: 0;
            top: 30%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation: ambientFloat 12s ease-in-out infinite;
            filter: blur(60px);
        }
        @keyframes ambientFloat {
            0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.5; }
            25% { transform: translate(-45%, -55%) scale(1.05); opacity: 0.7; }
            50% { transform: translate(-55%, -45%) scale(0.95); opacity: 0.4; }
            75% { transform: translate(-48%, -52%) scale(1.03); opacity: 0.6; }
        }

        /* ─ CLICK RIPPLE EFFECT ─ */
        .ripple-effect {
            position: absolute;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(174,0,0,0.4) 0%, rgba(174,0,0,0.1) 40%, transparent 70%);
            transform: scale(0);
            animation: rippleExpand 0.5s ease-out forwards;
            pointer-events: none;
            z-index: 1;
        }
        @keyframes rippleExpand {
            0% { transform: scale(0); opacity: 1; }
            100% { transform: scale(4); opacity: 0; }
        }

        /* ─ CARD ICON BOUNCE ON HOVER ─ */
        .link-card:hover .link-icon {
            animation: iconContainerBounce 0.4s ease;
        }
        @keyframes iconContainerBounce {
            0% { transform: scale(1); }
            30% { transform: scale(1.12); }
            60% { transform: scale(0.95); }
            100% { transform: scale(1); }
        }

        /* ─ PREFERS REDUCED MOTION ─ */
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                transition-duration: 0.01ms !important;
            }
            .scanline, .grain, .cursor-glow, #bg-canvas, .morph-blob, .avatar-particle, .ambient-orb {
                display: none !important;
            }
            .tagline {
                width: 100% !important;
                border-right: none !important;
            }
        }

/* --- bloc original 2/8 --- */
.vcard-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.15rem;border-radius:999px;background:linear-gradient(135deg,#cda85c,#e8c47a);color:#1a1306;font-weight:700;font-size:.82rem;text-decoration:none;border:0;box-shadow:0 6px 20px rgba(205,168,92,.25);transition:transform .2s,box-shadow .2s}
        .vcard-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(205,168,92,.42)}
        .vcard-btn svg{flex:0 0 auto}
        .live-badge{display:inline-flex;align-items:center;gap:.45rem;margin:.5rem auto 0;padding:.4rem .9rem;border-radius:999px;background:rgba(174,0,0,.16);border:1px solid rgba(174,0,0,.5);color:#ff5252;font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}
        .live-badge__dot{width:8px;height:8px;border-radius:50%;background:#ff2b2b;box-shadow:0 0 0 0 rgba(255,43,43,.7);animation:liveDot 1.4s infinite}
        @keyframes liveDot{0%{box-shadow:0 0 0 0 rgba(255,43,43,.7)}70%{box-shadow:0 0 0 8px rgba(255,43,43,0)}100%{box-shadow:0 0 0 0 rgba(255,43,43,0)}}
        .avatar-wrapper.is-live .avatar-ring{box-shadow:0 0 0 3px #ff2b2b,0 0 24px 4px rgba(255,43,43,.55);animation:liveRing 1.6s ease-in-out infinite}
        @keyframes liveRing{0%,100%{box-shadow:0 0 0 3px #ff2b2b,0 0 22px 3px rgba(255,43,43,.45)}50%{box-shadow:0 0 0 4px #ff2b2b,0 0 34px 8px rgba(255,43,43,.72)}}
        .link-pop{display:inline-block;margin-left:.45rem;font-size:.6rem;font-weight:700;letter-spacing:.08em;color:#cda85c;border:1px solid rgba(205,168,92,.4);border-radius:4px;padding:.05rem .35rem;vertical-align:middle}
        @media (prefers-reduced-motion:reduce){.live-badge__dot,.avatar-wrapper.is-live .avatar-ring{animation:none}}

/* --- bloc original 3/8 --- */
.viralbar{display:none;max-width:520px;margin:0 auto 12px;padding:.8rem 1.05rem;border-radius:12px;background:linear-gradient(135deg,rgba(174,0,0,.22),rgba(205,168,92,.1));border:1px solid rgba(205,168,92,.45);text-align:center}
.viralbar.on{display:block}
.viralbar__t{font-family:'Oswald',sans-serif;font-weight:700;font-size:.86rem;color:#f5f5f5;letter-spacing:.01em}
.viralbar__d{font-size:.78rem;color:rgba(245,245,245,.72);margin-top:.25rem}

/* --- bloc original 4/8 --- */
.topcons{max-width:520px;margin:0 auto 12px}
        .topcons__card{position:relative;display:block;text-decoration:none;border-radius:16px;padding:1.25rem 1.3rem;background:linear-gradient(150deg,rgba(174,0,0,.24),rgba(205,168,92,.12));border:1px solid rgba(205,168,92,.5);overflow:hidden;transition:border-color .2s,transform .2s}
        .topcons__card:hover{border-color:rgba(205,168,92,.85);transform:translateY(-2px)}
        .topcons__card::before{content:"";position:absolute;inset:0;background:radial-gradient(460px 200px at 115% -20%,rgba(205,168,92,.22),transparent 60%);pointer-events:none}
        .topcons__head{position:relative;display:flex;align-items:center;gap:.65rem;margin-bottom:.85rem}
        .topcons__ic{flex:0 0 auto;width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:rgba(205,168,92,.14);border:1px solid rgba(205,168,92,.4);color:#cda85c}
        .topcons__badge{font-size:.58rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#cda85c;border:1px solid rgba(205,168,92,.5);border-radius:5px;padding:.22rem .5rem;line-height:1.3}
        .topcons__t{position:relative;font-family:'Benzin','Oswald',sans-serif;font-weight:700;font-size:1.3rem;color:#f5f5f5;line-height:1.08;margin-bottom:.45rem}
        .topcons__d{position:relative;font-size:.85rem;color:rgba(245,245,245,.8);line-height:1.5;margin-bottom:1rem}
        .topcons__cta{position:relative;display:flex;align-items:center;justify-content:center;gap:.55rem;width:100%;background:linear-gradient(135deg,#cda85c,#e8c47a);color:#1a1306;font-family:'Oswald','Montserrat',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:.9rem;padding:.85rem;border-radius:11px}
        .topcons__price{background:rgba(26,19,6,.16);border-radius:6px;padding:.06rem .45rem}

/* --- bloc original 5/8 --- */
.spot{display:none;margin:0 auto 6px;width:100%;max-width:520px}
        .spot.is-on{display:block;animation:spotIn .5s ease}
        @keyframes spotIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
        .spot__lbl{display:block;text-align:center;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(245,245,245,.4);margin-bottom:.5rem}
        .spot__wrap{position:relative}
        .spot__card{position:relative;display:block;text-decoration:none;border-radius:16px;padding:1.05rem 1.2rem;background:linear-gradient(135deg,rgba(174,0,0,.17),rgba(205,168,92,.08));border:1px solid rgba(205,168,92,.38);overflow:hidden}
        .spot__card::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 160px at 110% -10%,rgba(205,168,92,.2),transparent 60%)}
        .spot__row{position:relative;display:flex;align-items:center;gap:.9rem}
        .spot__txt{flex:1;min-width:0}
        .spot__badge{display:inline-block;font-size:.56rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#cda85c;border:1px solid rgba(205,168,92,.5);border-radius:4px;padding:.12rem .4rem;margin-bottom:.35rem}
        .spot__t{font-weight:800;font-size:1.02rem;color:#f5f5f5;line-height:1.2}
        .spot__d{font-size:.82rem;color:rgba(245,245,245,.7);margin-top:.2rem;line-height:1.4}
        .spot__cta{flex:0 0 auto;background:linear-gradient(135deg,#cda85c,#e8c47a);color:#1a1306;font-weight:800;font-size:.78rem;padding:.6rem .95rem;border-radius:10px;white-space:nowrap}
        .spot__close{position:absolute;top:-.4rem;right:-.2rem;z-index:3;background:rgba(0,0,0,.45);border:0;color:rgba(245,245,245,.6);width:22px;height:22px;border-radius:50%;font-size:1rem;cursor:pointer;line-height:1}
        @media(max-width:430px){.spot__d{display:none}}
        @media (prefers-reduced-motion:reduce){.spot.is-on{animation:none}}

/* --- bloc original 6/8 --- */
.lm{max-width:520px;margin:0 auto 8px;border:1px solid rgba(205,168,92,.32);border-radius:16px;padding:1.1rem 1.2rem;background:linear-gradient(135deg,rgba(205,168,92,.1),rgba(174,0,0,.06))}
        .lm__top{display:flex;align-items:center;gap:.7rem;margin-bottom:.75rem}
        .lm__ico{flex:0 0 auto;font-size:1.5rem;line-height:1}
        .lm__t{font-family:'Benzin','Oswald',sans-serif;font-weight:700;color:#f5f5f5;font-size:1rem;line-height:1.2;letter-spacing:.01em}
        .lm__d{font-size:.82rem;color:rgba(245,245,245,.66);margin-top:.15rem}
        .lm__form{display:flex;gap:.5rem;flex-wrap:wrap}
        .lm__in{flex:1;min-width:160px;background:#0a0a0a;border:1px solid rgba(255,255,255,.14);border-radius:10px;color:#f5f5f5;padding:.7rem .9rem;font-size:.92rem;font-family:inherit}
        .lm__in:focus{outline:none;border-color:#cda85c}
        .lm__btn{background:linear-gradient(135deg,#cda85c,#e8c47a);color:#1a1306;font-weight:800;border:0;border-radius:10px;padding:.7rem 1.1rem;font-size:.85rem;cursor:pointer;white-space:nowrap}
        .lm__msg{font-size:.85rem;margin:.6rem 0 0;display:none}
        .lm__dl{display:none;margin-top:.6rem;background:#0a0a0a;border:1px solid rgba(205,168,92,.45);color:#cda85c;font-weight:700;text-decoration:none;padding:.65rem 1rem;border-radius:10px;text-align:center}
        .lm__buy{margin-top:.85rem;padding-top:.8rem;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
        .lm__buytxt{font-size:.78rem;color:rgba(245,245,245,.6);flex:1;min-width:150px;line-height:1.3}
        .lm__buybtn{background:#0a0a0a;border:1px solid rgba(205,168,92,.5);color:#cda85c;font-weight:800;text-decoration:none;padding:.6rem .95rem;border-radius:10px;font-size:.82rem;white-space:nowrap}
        .lm__buybtn:hover{background:rgba(205,168,92,.12)}
        .lm__buybtn--off{opacity:.45;cursor:not-allowed}
        .lm__consent{display:flex;gap:.5rem;align-items:flex-start;margin-top:.7rem;font-size:.72rem;color:rgba(245,245,245,.7);line-height:1.35;cursor:pointer}
        .lm__consent input{flex:0 0 auto;margin-top:.15rem;accent-color:#cda85c;width:15px;height:15px}
        .lm__cgv{margin-top:.5rem;font-size:.66rem;color:rgba(245,245,245,.4);line-height:1.4}
        .lm__cgv a{color:rgba(205,168,92,.7)}

/* --- bloc original 7/8 --- */
.eco-footer{background:#070707;border-top:1px solid rgba(205,168,92,.18);padding:3rem 1.25rem 2.4rem;font-family:'Montserrat',sans-serif}
.eco-footer__in{max-width:1180px;margin:0 auto;display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:760px){.eco-footer__in{grid-template-columns:1.1fr 3fr}}
.eco-footer__logo{display:block;font-family:'Benzin','Oswald',sans-serif;font-weight:700;letter-spacing:.16em;font-size:.92rem;color:#f5f5f5;text-transform:uppercase}
.eco-footer__tag{display:block;margin-top:.5rem;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:#cda85c}
.eco-footer__cols{display:grid;gap:1.6rem;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.eco-footer__cols{grid-template-columns:repeat(4,1fr)}}
.eco-footer__h{display:block;font-family:'Oswald',sans-serif;font-size:.66rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#cda85c;margin-bottom:.7rem}
.eco-footer__col a{display:block;color:rgba(245,245,245,.62);text-decoration:none;font-size:.86rem;line-height:1.5;padding:.18rem 0;transition:color .2s}
.eco-footer__col a:hover{color:#f5f5f5}

/* --- bloc original 8/8 --- */
#as-cookie{position:fixed;left:0;right:0;bottom:0;z-index:99990;display:none;background:#0a0a0a;border-top:1px solid rgba(205,168,92,.35);box-shadow:0 -12px 36px rgba(0,0,0,.55);padding:20px 18px;padding-bottom:calc(20px + env(safe-area-inset-bottom));font-family:'Montserrat',system-ui,Arial,sans-serif;color:#cfcabf}
#as-cookie .asc-in{max-width:1080px;margin:0 auto;display:flex;gap:16px 26px;align-items:center;justify-content:space-between;flex-wrap:wrap}
#as-cookie .asc-txt{max-width:680px}
#as-cookie .asc-kick{display:block;font-family:'Oswald',sans-serif;font-size:.66rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#cda85c;margin-bottom:.4rem}
#as-cookie p{margin:0;font-size:.85rem;line-height:1.6;letter-spacing:.01em}
#as-cookie a{color:#cda85c;text-decoration:underline;text-underline-offset:2px}
#as-cookie .asc-btns{display:flex;gap:10px;flex:0 0 auto}
#as-cookie button{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:600;padding:.75rem 1.4rem;border-radius:4px;cursor:pointer;border:1px solid transparent;transition:.2s ease}
#as-cookie .asc-ok{background:#ae0000;color:#f5f5f5;border-color:#ae0000}
#as-cookie .asc-ok:hover{background:#c40000;border-color:#c40000;box-shadow:0 0 24px rgba(174,0,0,.35)}
#as-cookie .asc-no{background:transparent;color:#cfcabf;border-color:rgba(255,255,255,.2)}
#as-cookie .asc-no:hover{border-color:#cda85c;color:#cda85c}
@media(max-width:560px){#as-cookie .asc-in{flex-direction:column;align-items:stretch}#as-cookie .asc-btns{justify-content:flex-end}}