{"id":8,"date":"2026-05-14T05:53:08","date_gmt":"2026-05-14T05:53:08","guid":{"rendered":"https:\/\/clutchmascot.lol\/?page_id=8"},"modified":"2026-05-14T07:43:56","modified_gmt":"2026-05-14T07:43:56","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/clutchmascot.lol\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-82048f3 e-con-full e-flex e-con e-parent\" data-id=\"82048f3\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ab6125a elementor-widget elementor-widget-html\" data-id=\"ab6125a\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Anton&family=Inter:wght@400;700;900&display=swap');\n\n    :root {\n        --us-blue: #00b3ff;\n        --mx-green: #00ff66;\n        --ca-red: #ff003c;\n        --gold: #ffd700;\n        --solid-white: #ffffff;\n    }\n\n    * {\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n    }\n\n    .clutch-container {\n        font-family: 'Inter', sans-serif;\n        background-color: #000;\n        color: var(--solid-white);\n        overflow-x: hidden;\n    }\n\n    \/* Solid Typography with Thinner Outline & Solid Drop Shadow *\/\n    .clutch-container h1, \n    .clutch-container h2, \n    .clutch-container h3 {\n        font-family: 'Anton', sans-serif;\n        text-transform: uppercase;\n        letter-spacing: 2px;\n        line-height: 1;\n        position: relative;\n        z-index: 2;\n        -webkit-text-stroke: 1.5px #000;\n        text-shadow: 5px 5px 0px #000;\n    }\n\n    .clutch-container h1 {\n        font-size: clamp(6rem, 15vw, 14rem);\n        color: var(--solid-white);\n        margin-bottom: 1rem;\n        -webkit-text-stroke: 2px #000;\n        text-shadow: 8px 8px 0px #000;\n    }\n\n    .clutch-container h2 {\n        font-size: clamp(4rem, 8vw, 8rem);\n        color: var(--gold);\n        margin-bottom: 2rem;\n    }\n\n    .clutch-container h3 {\n        font-size: clamp(2rem, 4vw, 4rem);\n        color: var(--solid-white);\n    }\n\n    \/* Body Text (NO STROKE, solid shadow) *\/\n    .clutch-container p {\n        font-size: clamp(1.2rem, 2vw, 1.8rem);\n        font-weight: 900;\n        line-height: 1.5;\n        max-width: 900px;\n        color: var(--solid-white);\n        margin-bottom: 2rem;\n        position: relative;\n        z-index: 2;\n        text-shadow: 3px 3px 0px #000, 0 0 10px rgba(0,0,0,0.8);\n    }\n\n    \/* Base Section Style *\/\n    .clutch-section {\n        position: relative;\n        min-height: 100vh;\n        width: 100%;\n        display: flex;\n        align-items: center;\n        background-size: cover;\n        background-position: center;\n        padding: 8rem 5%;\n    }\n\n    #section1 { background-color: #000; justify-content: center; text-align: center; }\n    #section2 { background-image: url('http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/bg2.jpg'); }\n    #section3 { background-image: url('http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/bg3.jpg'); }\n    #section4 { background-image: url('http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/bg4.jpg'); align-items: flex-end; padding-bottom: 0; }\n\n    \/* Video Background Elements *\/\n    .bg-video-wrapper {\n        position: absolute;\n        top: 0; left: 0; width: 100%; height: 100%;\n        overflow: hidden;\n        z-index: 0;\n    }\n\n    .bg-video-wrapper video {\n        min-width: 100%;\n        min-height: 100%;\n        width: auto;\n        height: auto;\n        position: absolute;\n        top: 50%; left: 50%;\n        transform: translate(-50%, -50%);\n        object-fit: cover;\n    }\n\n    \/* Layout Grid *\/\n    .content-grid {\n        position: relative;\n        z-index: 2;\n        width: 100%;\n        max-width: 1600px;\n        margin: 0 auto;\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));\n        gap: 5rem;\n        align-items: center;\n    }\n\n    .pure-text-block {\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n    }\n\n    #section3 .pure-text-block {\n        align-items: center;\n        text-align: center;\n    }\n    #section3 .neon-line { margin: 2rem auto; }\n    #section3 p { text-align: center; }\n\n    \/* Dividers *\/\n    .divider-wrapper {\n        position: relative;\n        width: 100%;\n        height: 0;\n        z-index: 10;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n    .glow-bar { position: absolute; width: 120%; height: 25px; }\n    .bar-1 { background: var(--us-blue); box-shadow: 0 0 30px var(--us-blue); transform: rotate(-3deg); }\n    .bar-2 { background: var(--mx-green); box-shadow: 0 0 30px var(--mx-green); transform: rotate(2deg); }\n    .bar-3 { background: var(--ca-red); box-shadow: 0 0 30px var(--ca-red); transform: rotate(-1.5deg); }\n\n    \/* Player Roster *\/\n    .roster-grid {\n        display: grid;\n        grid-template-columns: repeat(4, 1fr);\n        gap: 1rem;\n        width: 100%;\n        align-items: flex-end; \n        margin-top: 2rem;\n    }\n\n    @media (max-width: 1000px) { .roster-grid { grid-template-columns: repeat(2, 1fr); } }\n\n    .player-item {\n        display: flex;\n        flex-direction: column;\n        justify-content: flex-end;\n        align-items: center;\n        text-align: center;\n        cursor: pointer;\n    }\n\n    .player-item h3 { font-size: clamp(2rem, 4vw, 3.5rem); margin-bottom: 0.2rem; }\n    .player-item p { font-size: 1.5rem; color: var(--solid-white); margin-bottom: 1rem; }\n\n    @keyframes playerIdle {\n        0%, 100% { transform: translateY(0px); }\n        50% { transform: translateY(-12px); }\n    }\n\n    .player-item img {\n        width: 100%;\n        max-width: 350px;\n        object-fit: contain;\n        display: block;\n        filter: drop-shadow(5px 5px 0px rgba(0,0,0,0.8));\n        transform-origin: bottom center;\n        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);\n        animation: playerIdle 3s ease-in-out infinite;\n    }\n\n    .player-item:nth-child(1) img { animation-delay: 0s; }\n    .player-item:nth-child(2) img { animation-delay: 0.8s; }\n    .player-item:nth-child(3) img { animation-delay: 1.5s; }\n    .player-item:nth-child(4) img { animation-delay: 0.4s; }\n\n    .player-item:hover img {\n        animation-play-state: paused;\n        transform: scale(1.08) translateY(-15px);\n        filter: drop-shadow(12px 12px 0px rgba(0,0,0,0.9));\n    }\n    .player-item:hover h3 { color: var(--gold) !important; transform: translateY(-5px); transition: all 0.3s ease; }\n\n    \/* UI Elements *\/\n    .neon-line {\n        height: 8px; width: 120px; background: var(--gold); margin: 2rem 0;\n        border: 2px solid #000; box-shadow: 4px 4px 0px #000;\n    }\n    .color-slash {\n        display: inline-block; width: 25px; height: 80px; transform: skew(-20deg); margin-right: 15px;\n        border: 2px solid #000; box-shadow: 4px 4px 0px #000;\n    }\n    .slash-us { background: var(--us-blue); }\n    .slash-mx { background: var(--mx-green); }\n    .slash-ca { background: var(--ca-red); }\n\n    \/* Contract Address Copy Box *\/\n    .ca-box {\n        background: #fff;\n        color: #000;\n        padding: 12px 25px;\n        font-size: clamp(1rem, 2vw, 1.5rem);\n        font-family: 'Inter', sans-serif;\n        font-weight: 900;\n        border: 4px solid #000;\n        box-shadow: 6px 6px 0px var(--ca-red);\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        margin: 10px auto 2rem auto;\n        cursor: pointer;\n        transition: all 0.1s ease-in-out;\n        word-break: break-all;\n    }\n    .ca-box:active {\n        transform: translate(6px, 6px);\n        box-shadow: 0px 0px 0px var(--ca-red);\n    }\n\n    \/* Brutalist Buttons *\/\n    .brutal-btn {\n        display: inline-block;\n        padding: 15px 35px;\n        font-family: 'Anton', sans-serif;\n        font-size: clamp(1.5rem, 2.5vw, 2rem);\n        text-transform: uppercase;\n        text-decoration: none;\n        border: 4px solid #000;\n        box-shadow: 8px 8px 0px #000;\n        transition: all 0.1s ease-in-out;\n        cursor: pointer;\n        letter-spacing: 2px;\n        position: relative;\n        z-index: 5;\n    }\n    .brutal-btn:hover {\n        transform: translate(-4px, -4px);\n        box-shadow: 12px 12px 0px #000;\n    }\n    .brutal-btn:active {\n        transform: translate(8px, 8px);\n        box-shadow: 0px 0px 0px #000;\n    }\n    \n    .btn-tg { background-color: #0088cc; color: #fff; text-shadow: 2px 2px 0px #000; -webkit-text-stroke: 1px #000; }\n    .btn-tw { background-color: #1DA1F2; color: #fff; text-shadow: 2px 2px 0px #000; -webkit-text-stroke: 1px #000; }\n    .btn-swap { background-color: var(--gold); color: #000; box-shadow: 8px 8px 0px var(--ca-red); }\n    .btn-swap:active { box-shadow: 0px 0px 0px var(--ca-red); }\n\n    \/* Animated Unwrapped GIF *\/\n    @keyframes floatingGif {\n        0%, 100% { transform: translateY(0px) scale(1.1) rotate(0deg); }\n        50% { transform: translateY(-30px) scale(1.15) rotate(2deg); }\n    }\n    .featured-gif {\n        width: 100%;\n        max-width: 1000px; \/* Made bigger *\/\n        border: none;\n        box-shadow: none;\n        animation: floatingGif 4s ease-in-out infinite;\n        \/* completely removed stroke and wrap *\/\n    }\n\n<\/style>\n\n<div class=\"clutch-container\">\n\n    <!-- SECTION 1: HERO -->\n    <section class=\"clutch-section\" id=\"section1\">\n        <div class=\"bg-video-wrapper\">\n            <video autoplay loop muted playsinline>\n                <source src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/6c83326b53f04644ac15576c41ce374e.mp4\" type=\"video\/mp4\">\n            <\/video>\n        <\/div>\n        \n        <div class=\"content-grid\" style=\"grid-template-columns: 1fr;\">\n            <div class=\"pure-text-block\" style=\"align-items: center;\">\n                <h1>CLUTCH<\/h1>\n                <h2>2026<\/h2>\n                <p style=\"text-align: center; max-width: 1200px; font-size: clamp(1.5rem, 3vw, 2.5rem); margin-bottom: 0;\">\n                    THE OFFICIAL MASCOT. THE ULTIMATE PLAYMAKER.\n                <\/p>\n                \n                <!-- CA COPY BOX -->\n                <div style=\"margin-top: 1.5rem; position: relative; z-index: 5;\">\n                    <p style=\"margin-bottom: 5px; font-size: 1rem; color: var(--gold); text-shadow: 2px 2px 0px #000;\">CA ADDRESS:<\/p>\n                    <div class=\"ca-box\" onclick=\"navigator.clipboard.writeText('YOUR_CONTRACT_ADDRESS_HERE'); alert('Contract Address Copied!');\">\n                        YOUR_CONTRACT_ADDRESS_HERE <span style=\"margin-left: 15px; font-size: 1.2rem;\">\ud83d\udccb<\/span>\n                    <\/div>\n                <\/div>\n\n                <!-- SOCIAL BUTTONS -->\n                <div style=\"display: flex; gap: 20px; flex-wrap: wrap; justify-content: center; margin-top: 1rem; position: relative; z-index: 5;\">\n                    <a href=\"https:\/\/t.me\/yourtelegram\" target=\"_blank\" class=\"brutal-btn btn-tg\">TELEGRAM<\/a>\n                    <a href=\"https:\/\/twitter.com\/yourtwitter\" target=\"_blank\" class=\"brutal-btn btn-tw\">TWITTER<\/a>\n                <\/div>\n\n                <div style=\"display: flex; gap: 20px; margin-top: 3rem; position: relative; z-index: 2;\">\n                    <div class=\"color-slash slash-mx\"><\/div>\n                    <div class=\"color-slash slash-us\"><\/div>\n                    <div class=\"color-slash slash-ca\"><\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <div class=\"divider-wrapper\">\n        <div class=\"glow-bar bar-1\"><\/div>\n    <\/div>\n\n    <!-- SECTION 2: NATIONS & MOMENTS (GIF) -->\n    <section class=\"clutch-section\" id=\"section2\">\n        <div class=\"content-grid\">\n            <div class=\"pure-text-block\">\n                <h2 style=\"color: var(--ca-red);\">UNITED CONTINENT<\/h2>\n                <div class=\"neon-line\" style=\"background: var(--ca-red);\"><\/div>\n                \n                <h3 style=\"font-size: clamp(3rem, 6vw, 6rem); margin-bottom: 2rem; color: var(--us-blue);\">USA<\/h3>\n                <h3 style=\"font-size: clamp(3rem, 6vw, 6rem); margin-bottom: 2rem; color: var(--mx-green);\">MEXICO<\/h3>\n                <h3 style=\"font-size: clamp(3rem, 6vw, 6rem); margin-bottom: 2rem; color: var(--ca-red);\">CANADA<\/h3>\n                \n                <h2 style=\"margin-top: 4rem; color: var(--solid-white);\">ICONIC MOMENTS<\/h2>\n                <p>\n                    THE WORLD WATCHES AS UNFORGETTABLE FOOTBALL HISTORY IS WRITTEN ACROSS THREE SOVEREIGN NATIONS. THE GREATEST TOURNAMENT ON EARTH.\n                <\/p>\n\n                <!-- RANDOM SWAP NOW BUTTON -->\n                <div style=\"margin-top: 2rem;\">\n                    <a href=\"#\" class=\"brutal-btn btn-swap\">SWAP NOW \ud83d\udcb8<\/a>\n                <\/div>\n            <\/div>\n            \n            <div style=\"display: flex; justify-content: flex-end; align-items: center; position: relative; z-index: 2;\">\n                <!-- UNWRAPPED, SCALED UP & ANIMATED GIF -->\n                <img decoding=\"async\" src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/0514-ezgif.com-effects.gif\" alt=\"Clutch Effects\" class=\"featured-gif\">\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <div class=\"divider-wrapper\">\n        <div class=\"glow-bar bar-2\"><\/div>\n    <\/div>\n\n    <!-- SECTION 3: MASCOTS (Aligned Center) -->\n    <section class=\"clutch-section\" id=\"section3\">\n        <div class=\"content-grid\" style=\"grid-template-columns: 1fr;\">\n            <div class=\"pure-text-block\">\n                <h2 style=\"color: var(--mx-green);\">THE TRIO<\/h2>\n                <div class=\"neon-line\" style=\"background: var(--mx-green);\"><\/div>\n                <p>\n                    CLUTCH DOES NOT STAND ALONE. MEET THE GUARDIANS OF THE 2026 WORLD CUP TROPHY.\n                <\/p>\n                \n                <div style=\"margin-top: 3rem; max-width: 800px; margin-left: auto; margin-right: auto;\">\n                    <h3 style=\"color: var(--solid-white);\">ZAYU<\/h3>\n                    <p style=\"color: var(--mx-green); margin-bottom: 2rem;\">THE MEXICAN JAGUAR. UNMATCHED AGILITY AND FIERCE POWER.<\/p>\n                    \n                    <h3 style=\"color: var(--solid-white);\">MAPLE<\/h3>\n                    <p style=\"color: var(--ca-red); margin-bottom: 0;\">THE CANADIAN MOOSE. AN UNSTOPPABLE FORCE OF NATURE.<\/p>\n                <\/div>\n\n                <!-- RANDOM SWAP NOW BUTTON -->\n                <div style=\"margin-top: 4rem;\">\n                    <a href=\"#\" class=\"brutal-btn btn-swap\" style=\"font-size: clamp(2rem, 3vw, 3rem);\">SWAP $CLUTCH<\/a>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/section>\n\n    <div class=\"divider-wrapper\">\n        <div class=\"glow-bar bar-3\"><\/div>\n    <\/div>\n\n    <!-- SECTION 4: LEGENDS & STADIUMS -->\n    <section class=\"clutch-section\" id=\"section4\">\n        <div class=\"content-grid\" style=\"grid-template-columns: 1fr; align-items: flex-end; height: 100%;\">\n            <div class=\"pure-text-block\" style=\"justify-content: flex-end; height: 100%; text-align: center;\">\n                \n                <div style=\"padding-top: 4rem;\">\n                    <h2 style=\"color: var(--us-blue);\">GLOBAL ICONS<\/h2>\n                    <div class=\"neon-line\" style=\"background: var(--us-blue); margin: 2rem auto;\"><\/div>\n                    <p style=\"margin: 0 auto 4rem auto;\">WITNESS THE LEGENDS DOMINATE THE PITCH IN THE LATEST 2026 KITS.<\/p>\n                <\/div>\n\n                <!-- Players Row -->\n                <div class=\"roster-grid\">\n                    \n                    <!-- Neymar -->\n                    <div class=\"player-item\">\n                        <h3 style=\"color: var(--mx-green);\">NEYMAR JR.<\/h3>\n                        <p>BRAZIL<\/p>\n                        <img decoding=\"async\" src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/neymar.png\" alt=\"Neymar Jr\">\n                    <\/div>\n\n                    <!-- Messi -->\n                    <div class=\"player-item\">\n                        <h3 style=\"color: var(--us-blue);\">MESSI<\/h3>\n                        <p>ARGENTINA<\/p>\n                        <img decoding=\"async\" src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/messi.png\" alt=\"Lionel Messi\">\n                    <\/div>\n\n                    <!-- Ronaldo -->\n                    <div class=\"player-item\">\n                        <h3 style=\"color: var(--ca-red);\">RONALDO<\/h3>\n                        <p>PORTUGAL<\/p>\n                        <img decoding=\"async\" src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/ronaldo.png\" alt=\"Cristiano Ronaldo\">\n                    <\/div>\n\n                    <!-- Pulisic -->\n                    <div class=\"player-item\">\n                        <h3 style=\"color: var(--us-blue);\">PULISIC<\/h3>\n                        <p>USA<\/p>\n                        <img decoding=\"async\" src=\"http:\/\/clutchmascot.lol\/wp-content\/uploads\/2026\/05\/cristian.png\" alt=\"Christian Pulisic\">\n                    <\/div>\n\n                <\/div>\n\n            <\/div>\n        <\/div>\n    <\/section>\n\n<\/div>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>CLUTCH 2026 THE OFFICIAL MASCOT. THE ULTIMATE PLAYMAKER. CA ADDRESS: YOUR_CONTRACT_ADDRESS_HERE \ud83d\udccb TELEGRAM TWITTER UNITED CONTINENT USA MEXICO CANADA ICONIC MOMENTS THE WORLD WATCHES AS UNFORGETTABLE FOOTBALL HISTORY IS WRITTEN ACROSS THREE SOVEREIGN NATIONS. THE GREATEST TOURNAMENT ON EARTH. SWAP NOW \ud83d\udcb8 THE TRIO CLUTCH DOES NOT STAND ALONE. MEET THE GUARDIANS OF THE 2026 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":19,"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":42,"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/42"}],"wp:attachment":[{"href":"https:\/\/clutchmascot.lol\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}