* {
            box-sizing: border-box;
        }

        html,
        body {
            margin: 0;
            padding: 0;
            width: 100%;
            min-height: 100%;
        }

        body {

            color: #ffffff;

            font-family:
                "Rajdhani",
                sans-serif;

            background:
                linear-gradient(
                    rgba(2, 8, 18, .50),
                    rgba(2, 8, 18, .76)
                ),
                var(--bg-image, url("/assets/images/fond.png"))
                center center / cover fixed no-repeat;
        }


        /* =========================================
           NAVIGATION
        ========================================= */

        .navbar {

            position: relative;
            z-index: 100;

            height: 62px;

            display: flex;
            align-items: center;
            justify-content: center;

            background:
                rgba(1, 6, 13, .94);

            border-bottom:
                2px solid
                rgba(var(--blue-rgb), .85);

            box-shadow:
                0 0 18px
                rgba(var(--blue-rgb), .28);
        }

        .navigation {

            display: flex;
            align-items: center;
            justify-content: center;

            gap: 34px;

            width: 100%;
            height: 100%;
        }

        .navigation a {

            position: relative;

            color:
                rgba(255,255,255,.86);

            text-decoration: none;

            font-size: 14px;
            font-weight: 700;

            transition:
                color .25s ease,
                text-shadow .25s ease;
        }

        .navigation a:hover {

            color: var(--cyan);

            text-shadow:
                0 0 10px
                rgba(var(--blue-light-rgb), .75);
        }

        .navigation a[href="/donation"] {

            color: var(--cyan);

            text-shadow:
                0 0 10px
                rgba(var(--blue-light-rgb), .65);
        }

        .navigation a[href="/donation"]::after {

            content: "";

            position: absolute;

            left: 50%;
            bottom: -12px;

            width: 26px;
            height: 2px;

            transform:
                translateX(-50%);

            background:
                #49dcff;

            border-radius: 10px;

            box-shadow:
                0 0 10px
                rgba(var(--blue-light-rgb), .8);
        }


        /* =========================================
           PAGE
        ========================================= */

        .donation-page {

            min-height:
                calc(100vh - 138px);

            padding:
                18px 24px 14px;

            display:
                flex;

            align-items:
                center;

            justify-content:
                center;
        }

        .donation-container {

            width:
                min(1000px, 100%);

            margin:
                0 auto;
        }


        /* =========================================
           HEADER
        ========================================= */

        .donation-header {

            text-align:
                center;

            margin-bottom:
                15px;
        }

        .donation-kicker {

            display:
                block;

            margin-bottom:
                3px;

            color:
                #4edfff;

            font-size:
                11px;

            font-weight:
                700;

            letter-spacing:
                5px;

            text-shadow:
                0 0 10px
                rgba(var(--blue-light-rgb), .75);
        }

        .donation-title {

            margin:
                0;

            font-family:
                "Kalam",
                cursive;

            font-size:
                clamp(43px, 4.7vw, 64px);

            line-height:
                .90;

            color:
                #ffffff;

            text-shadow:
                0 0 12px
                rgba(255,255,255,.50),

                0 0 32px
                rgba(var(--blue-rgb), .40);
        }

        .donation-description {

            width:
                min(720px, 100%);

            margin:
                8px auto 0;

            color:
                rgba(255,255,255,.74);

            font-size:
                14px;

            line-height:
                1.35;
        }


        /* =========================================
           BLOC PAYPAL
        ========================================= */

        .donation-box {

            position:
                relative;

            width:
                min(850px, 100%);

            margin:
                0 auto;

            padding:
                21px 35px 18px;

            text-align:
                center;

            border:
                1px solid
                rgba(var(--blue-light-rgb), .40);

            border-radius:
                22px;

            background:
                linear-gradient(
                    145deg,
                    rgba(7,24,42,.92),
                    rgba(2,8,17,.95)
                );

            box-shadow:
                0 10px 28px
                rgba(0,0,0,.30),

                0 0 28px
                rgba(var(--blue-rgb), .10),

                inset 0 0 35px
                rgba(var(--blue-rgb), .04);
        }

        .donation-box::before {

            content:
                "";

            position:
                absolute;

            left:
                50%;

            top:
                -100px;

            width:
                260px;

            height:
                260px;

            transform:
                translateX(-50%);

            border-radius:
                50%;

            background:
                radial-gradient(
                    circle,
                    rgba(var(--blue-light-rgb), .13),
                    transparent 68%
                );

            pointer-events:
                none;
        }


        /* =========================================
           LOGO
        ========================================= */

        .donation-logo {

            position:
                relative;

            width:
                155px;

            height:
                155px;

            margin:
                0 auto 11px;

            display:
                flex;

            align-items:
                center;

            justify-content:
                center;

            border-radius:
                50%;

            border:
                2px solid
                rgba(var(--cyan-rgb), .82);

            background:
                radial-gradient(
                    circle,
                    rgba(var(--blue-rgb), .19),
                    rgba(0,0,0,.65)
                );

            box-shadow:
                0 0 23px
                rgba(var(--blue-light-rgb), .46),

                0 0 52px
                rgba(var(--blue-rgb), .18);
        }

        .donation-logo img {

            width:
                100%;

            height:
                100%;

            object-fit:
                contain;

            padding:
                7px;

            filter:
                drop-shadow(
                    0 0 13px
                    rgba(var(--blue-rgb), .72)
                )

                drop-shadow(
                    0 0 28px
                    rgba(var(--blue-rgb), .38)
                );
        }


        /* =========================================
           TEXTE PAYPAL
        ========================================= */

        .donation-box h2 {

            position:
                relative;

            margin:
                0 0 6px;

            font-family:
                "Kalam",
                cursive;

            font-size:
                32px;

            line-height:
                1;

            color:
                #ffffff;

            text-shadow:
                0 0 12px
                rgba(var(--blue-rgb), .35);
        }

        .donation-text {

            position:
                relative;

            width:
                min(680px, 100%);

            margin:
                0 auto;

            color:
                rgba(255,255,255,.69);

            font-size:
                14px;

            line-height:
                1.4;
        }


        /* =========================================
           PAYPAL BUTTON
        ========================================= */

        .paypal-button {

            position:
                relative;

            display:
                inline-flex;

            align-items:
                center;

            justify-content:
                center;

            margin:
                16px auto 0;

            min-width:
                270px;

            padding:
                13px 30px;

            border:
                1px solid
                rgba(var(--cyan-rgb), .85);

            border-radius:
                11px;

            background:
                linear-gradient(
                    135deg,
                    rgba(var(--blue-rgb), .95),
                    rgba(0,90,210,.95)
                );

            color:
                #ffffff;

            text-decoration:
                none;

            font-size:
                15px;

            font-weight:
                700;

            letter-spacing:
                1.5px;

            box-shadow:
                0 0 17px
                rgba(var(--blue-rgb), .35);

            transition:
                transform .25s ease,
                box-shadow .25s ease,
                filter .25s ease;
        }

        .paypal-button:hover {

            transform:
                translateY(-3px);

            filter:
                brightness(1.08);

            box-shadow:
                0 0 28px
                rgba(var(--blue-light-rgb), .55),

                0 0 55px
                rgba(var(--blue-rgb), .20);
        }


        /* =========================================
           LIEN
        ========================================= */

        .paypal-address {

            margin-top:
                7px;

            color:
                rgba(255,255,255,.42);

            font-size:
                11px;

            letter-spacing:
                .5px;
        }


        /* =========================================
           INFORMATIONS LÉGALES
        ========================================= */

        .legal-box {

            width:
                min(850px, 100%);

            height:
                145px;

            margin:
                12px auto 0;

            padding:
                14px 20px;

            overflow-y:
                auto;

            border:
                1px solid
                rgba(130,160,180,.22);

            border-radius:
                14px;

            background:
                rgba(2,8,16,.70);

            color:
                rgba(255,255,255,.66);

            font-size:
                12.5px;

            line-height:
                1.45;

            text-align:
                left;

            scrollbar-width:
                thin;

            scrollbar-color:
                rgba(var(--blue-light-rgb), .55)
                rgba(0,0,0,.20);
        }

        .legal-title {

            margin:
                0 0 7px;

            color:
                rgba(255,255,255,.92);

            font-size:
                13px;

            font-weight:
                700;

            letter-spacing:
                1.5px;

            text-transform:
                uppercase;
        }

        .legal-box p {

            margin:
                5px 0;
        }

        .legal-box strong {

            color:
                rgba(255,255,255,.84);
        }


        /* =========================================
           FOOTER
        ========================================= */

        .footer {

            height:
                76px;

            position:
                relative;

            z-index:
                10;

            background:
                rgba(1,7,15,.97);
        }

        .footer-line {

            width:
                100%;

            height:
                2px;

            background:
                #159dff;

            box-shadow:
                0 0 12px
                rgba(var(--blue-rgb), .75);
        }

        .footer-content {

            height:
                calc(100% - 2px);

            display:
                flex;

            align-items:
                center;

            justify-content:
                center;

            gap:
                32px;
        }

        .footer-brand {

            display:
                flex;

            align-items:
                center;

            gap:
                12px;
        }

        .footer-created {

            color:
                rgba(255,255,255,.72);

            font-size:
                12px;

            font-weight:
                600;

            letter-spacing:
                1px;
        }

        .enigma-logo {

            width:
                105px;

            height:
                auto;

            display:
                block;
        }

        .footer-separator {

            width:
                1px;

            height:
                27px;

            background:
                rgba(var(--blue-light-rgb), .75);

            box-shadow:
                0 0 8px
                rgba(var(--blue-light-rgb), .5);
        }

        .footer-copyright {

            color:
                rgba(255,255,255,.60);

            font-size:
                12px;

            font-weight:
                600;

            letter-spacing:
                1px;
        }


        /* =========================================
           PETITS ÉCRANS
        ========================================= */

        @media (
            max-height: 800px
        )
        and (
            min-width: 901px
        ) {

            .donation-page {

                padding:
                    8px 20px 7px;
            }

            .donation-header {

                margin-bottom:
                    8px;
            }

            .donation-logo {

                width:
                    135px;

                height:
                    135px;
            }

            .donation-box {

                padding:
                    15px 30px 13px;
            }

            .legal-box {

                height:
                    125px;

                font-size:
                    11.5px;
            }
        }


        /* =========================================
           MOBILE
        ========================================= */

        @media (max-width: 900px) {

            .navigation {

                gap:
                    20px;
            }
        }

        @media (max-width: 650px) {

            .navbar {

                height:
                    auto;

                min-height:
                    62px;

                padding:
                    10px 14px;
            }

            .navigation {

                flex-wrap:
                    wrap;

                gap:
                    12px 20px;
            }

            .navigation a {

                font-size:
                    12px;
            }

            .donation-page {

                min-height:
                    auto;

                padding:
                    28px 14px 25px;
            }

            .donation-title {

                font-size:
                    47px;
            }

            .donation-description {

                font-size:
                    14px;
            }

            .donation-box {

                padding:
                    22px 18px 18px;
            }

            .donation-logo {

                width:
                    140px;

                height:
                    140px;
            }

            .donation-box h2 {

                font-size:
                    30px;
            }

            .donation-text {

                font-size:
                    14px;
            }

            .paypal-button {

                width:
                    100%;

                min-width:
                    0;
            }

            .legal-box {

                height:
                    180px;

                font-size:
                    12px;

                line-height:
                    1.45;
            }

            .footer {

                height:
                    auto;

                min-height:
                    90px;
            }

            .footer-content {

                flex-direction:
                    column;

                gap:
                    8px;

                padding:
                    10px;
            }

            .footer-separator {

                display:
                    none;
            }
        }