{"id":79,"date":"2025-07-07T20:29:28","date_gmt":"2025-07-07T20:29:28","guid":{"rendered":"https:\/\/leafyville.com\/?page_id=79"},"modified":"2025-07-08T13:13:41","modified_gmt":"2025-07-08T13:13:41","slug":"home","status":"publish","type":"page","link":"https:\/\/leafyville.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Leafyville Media - Ethereal AI Fantasy Worlds<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);\r\n color: #ffffff;\r\n overflow-x: hidden;\r\n line-height: 1.6;\r\n }\r\n\r\n .container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 0 20px;\r\n }\r\n\r\n \/* Magical floating particles *\/\r\n .particles {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n z-index: 1;\r\n }\r\n\r\n .particle {\r\n position: absolute;\r\n width: 3px;\r\n height: 3px;\r\n background: linear-gradient(45deg, #4CAF50, #81C784, #A5D6A7);\r\n border-radius: 50%;\r\n animation: float 6s ease-in-out infinite;\r\n opacity: 0.7;\r\n }\r\n\r\n @keyframes float {\r\n 0%, 100% { transform: translateY(0px) rotate(0deg); opacity: 0.7; }\r\n 50% { transform: translateY(-20px) rotate(180deg); opacity: 1; }\r\n }\r\n\r\n \/* Navigation *\/\r\n nav {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n width: 100vw; \/* Full viewport width *\/\r\n background: rgba(0, 0, 0, 0.95);\r\n backdrop-filter: blur(15px);\r\n z-index: 1000;\r\n padding: 1rem 0;\r\n border-bottom: 1px solid rgba(76, 175, 80, 0.2);\r\n }\r\n \r\n .nav-container {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 0 20px;\r\n }\r\n\r\n .logo {\r\n display: flex;\r\n align-items: center;\r\n gap: 0.8rem;\r\n font-size: 1.8rem;\r\n font-weight: bold;\r\n color: #4CAF50;\r\n }\r\n\r\n .logo-img {\r\n width: 50px;\r\n height: 50px;\r\n border-radius: 50%;\r\n background: linear-gradient(135deg, #4CAF50, #81C784);\r\n padding: 3px;\r\n }\r\n\r\n .logo-img img {\r\n width: 100%;\r\n height: 100%;\r\n border-radius: 50%;\r\n }\r\n\r\n\r\n .nav-links {\r\n display: flex;\r\n list-style: none;\r\n gap: 2.5rem;\r\n margin-right: 5rem; \/* This pushes the nav slightly left toward center *\/\r\n }\r\n \r\n .nav-links a {\r\n color: #ffffff;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n position: relative;\r\n padding: 0.5rem 0;\r\n }\r\n\r\n .nav-links a:hover {\r\n color: #4CAF50;\r\n }\r\n\r\n .nav-links a::after {\r\n content: '';\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 0;\r\n height: 2px;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n transition: width 0.3s ease;\r\n }\r\n\r\n .nav-links a:hover::after {\r\n width: 100%;\r\n }\r\n\r\n \/* Hero Section *\/\r\n .hero {\r\n height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .hero::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: \r\n radial-gradient(circle at 20% 80%, rgba(76, 175, 80, 0.15) 0%, transparent 50%),\r\n radial-gradient(circle at 80% 20%, rgba(129, 199, 132, 0.15) 0%, transparent 50%),\r\n radial-gradient(circle at 40% 40%, rgba(165, 214, 167, 0.1) 0%, transparent 50%);\r\n animation: etherealPulse 6s ease-in-out infinite alternate;\r\n }\r\n\r\n @keyframes etherealPulse {\r\n 0% { opacity: 0.3; transform: scale(1); }\r\n 100% { opacity: 0.8; transform: scale(1.05); }\r\n }\r\n\r\n .hero-content {\r\n z-index: 10;\r\n position: relative;\r\n }\r\n\r\n .hero h1 {\r\n font-size: 4.5rem;\r\n margin-bottom: 1.5rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784, #A5D6A7, #C8E6C9);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n background-clip: text;\r\n animation: slideInLeft 1.2s ease-out;\r\n text-shadow: 0 0 50px rgba(76, 175, 80, 0.3);\r\n }\r\n\r\n .hero .subtitle {\r\n font-size: 1.8rem;\r\n margin-bottom: 1rem;\r\n color: #A5D6A7;\r\n animation: slideInRight 1.2s ease-out 0.3s both;\r\n }\r\n\r\n .hero p {\r\n font-size: 1.3rem;\r\n margin-bottom: 2.5rem;\r\n opacity: 0.9;\r\n animation: slideInRight 1.2s ease-out 0.6s both;\r\n max-width: 600px;\r\n }\r\n\r\n .cta-buttons {\r\n display: flex;\r\n gap: 1.5rem;\r\n animation: slideInUp 1.2s ease-out 0.9s both;\r\n }\r\n\r\n .cta-button {\r\n display: inline-block;\r\n padding: 1.2rem 2.5rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n color: white;\r\n text-decoration: none;\r\n border-radius: 50px;\r\n font-weight: bold;\r\n transition: all 0.3s ease;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .cta-button::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: -100%;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);\r\n transition: left 0.5s ease;\r\n }\r\n\r\n .cta-button:hover::before {\r\n left: 100%;\r\n }\r\n\r\n .cta-button:hover {\r\n transform: translateY(-3px);\r\n box-shadow: 0 15px 40px rgba(76, 175, 80, 0.4);\r\n }\r\n\r\n .cta-button.secondary {\r\n background: transparent;\r\n border: 2px solid #4CAF50;\r\n color: #4CAF50;\r\n }\r\n\r\n .cta-button.secondary:hover {\r\n background: #4CAF50;\r\n color: white;\r\n }\r\n\r\n @keyframes slideInLeft {\r\n from { transform: translateX(-100px); opacity: 0; }\r\n to { transform: translateX(0); opacity: 1; }\r\n }\r\n\r\n @keyframes slideInRight {\r\n from { transform: translateX(100px); opacity: 0; }\r\n to { transform: translateX(0); opacity: 1; }\r\n }\r\n\r\n @keyframes slideInUp {\r\n from { transform: translateY(50px); opacity: 0; }\r\n to { transform: translateY(0); opacity: 1; }\r\n }\r\n\r\n \/* About Section *\/\r\n .about {\r\n padding: 6rem 0;\r\n position: relative;\r\n }\r\n\r\n .about h2 {\r\n font-size: 3rem;\r\n text-align: center;\r\n margin-bottom: 3rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n background-clip: text;\r\n }\r\n\r\n .about-content {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 4rem;\r\n align-items: center;\r\n }\r\n\r\n .about-text {\r\n font-size: 1.2rem;\r\n line-height: 1.8;\r\n }\r\n\r\n .about-features {\r\n display: grid;\r\n gap: 1.5rem;\r\n }\r\n\r\n .feature-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 1rem;\r\n padding: 1.5rem;\r\n background: rgba(255,255,255,0.05);\r\n border-radius: 15px;\r\n border: 1px solid rgba(76, 175, 80, 0.2);\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .feature-item:hover {\r\n transform: translateX(10px);\r\n border-color: #4CAF50;\r\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.2);\r\n }\r\n\r\n .feature-icon {\r\n width: 50px;\r\n height: 50px;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 1.5rem;\r\n }\r\n\r\n \/* Services Section *\/\r\n .services {\r\n padding: 6rem 0;\r\n background: rgba(255,255,255,0.02);\r\n }\r\n\r\n .services h2 {\r\n font-size: 3rem;\r\n text-align: center;\r\n margin-bottom: 4rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n background-clip: text;\r\n }\r\n\r\n .services-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\r\n gap: 2.5rem;\r\n }\r\n\r\n .service-card {\r\n background: rgba(255,255,255,0.05);\r\n padding: 2.5rem;\r\n border-radius: 20px;\r\n border: 1px solid rgba(76, 175, 80, 0.2);\r\n transition: all 0.3s ease;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .service-card::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n height: 4px;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n }\r\n\r\n .service-card:hover {\r\n transform: translateY(-10px);\r\n box-shadow: 0 20px 50px rgba(76, 175, 80, 0.3);\r\n border-color: #4CAF50;\r\n }\r\n\r\n .service-card h3 {\r\n font-size: 1.5rem;\r\n margin-bottom: 1rem;\r\n color: #4CAF50;\r\n }\r\n\r\n .service-card p {\r\n margin-bottom: 1.5rem;\r\n opacity: 0.9;\r\n }\r\n\r\n .service-features {\r\n list-style: none;\r\n }\r\n\r\n .service-features li {\r\n padding: 0.5rem 0;\r\n border-bottom: 1px solid rgba(76, 175, 80, 0.1);\r\n }\r\n\r\n .service-features li:before {\r\n content: '\u2728 ';\r\n color: #4CAF50;\r\n }\r\n\r\n \/* Portfolio Preview *\/\r\n .portfolio {\r\n padding: 6rem 0;\r\n }\r\n\r\n .portfolio h2 {\r\n font-size: 3rem;\r\n text-align: center;\r\n margin-bottom: 4rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n background-clip: text;\r\n }\r\n\r\n .portfolio-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\r\n gap: 2rem;\r\n }\r\n\r\n .portfolio-item {\r\n aspect-ratio: 16\/9;\r\n background: linear-gradient(45deg, rgba(76, 175, 80, 0.1), rgba(129, 199, 132, 0.1));\r\n border-radius: 15px;\r\n border: 2px solid rgba(76, 175, 80, 0.2);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 1.2rem;\r\n color: #4CAF50;\r\n transition: all 0.3s ease;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .portfolio-item:hover {\r\n transform: scale(1.05);\r\n box-shadow: 0 15px 40px rgba(76, 175, 80, 0.3);\r\n }\r\n\r\n .portfolio-item::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: linear-gradient(45deg, transparent, rgba(76, 175, 80, 0.1), transparent);\r\n transform: translateX(-100%);\r\n transition: transform 0.6s ease;\r\n }\r\n\r\n .portfolio-item:hover::before {\r\n transform: translateX(100%);\r\n }\r\n\r\n \/* Contact Section *\/\r\n .contact {\r\n padding: 6rem 0;\r\n background: rgba(255,255,255,0.02);\r\n }\r\n\r\n .contact h2 {\r\n font-size: 3rem;\r\n text-align: center;\r\n margin-bottom: 3rem;\r\n background: linear-gradient(45deg, #4CAF50, #81C784);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n background-clip: text;\r\n }\r\n\r\n .contact-content {\r\n max-width: 800px;\r\n margin: 0 auto;\r\n text-align: center;\r\n }\r\n\r\n .contact p {\r\n font-size: 1.3rem;\r\n margin-bottom: 2rem;\r\n opacity: 0.9;\r\n }\r\n\r\n .social-links {\r\n display: flex;\r\n justify-content: center;\r\n gap: 2rem;\r\n margin-top: 2rem;\r\n }\r\n\r\n .social-link {\r\n display: inline-block;\r\n padding: 1rem;\r\n background: rgba(76, 175, 80, 0.1);\r\n border: 2px solid #4CAF50;\r\n border-radius: 50%;\r\n color: #4CAF50;\r\n text-decoration: none;\r\n transition: all 0.3s ease;\r\n width: 60px;\r\n height: 60px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 1.5rem;\r\n }\r\n\r\n .social-link:hover {\r\n background: #4CAF50;\r\n color: white;\r\n transform: translateY(-5px);\r\n box-shadow: 0 10px 30px rgba(76, 175, 80, 0.4);\r\n }\r\n\r\n \/* Footer *\/\r\n footer {\r\n padding: 2rem 0;\r\n border-top: 1px solid rgba(76, 175, 80, 0.2);\r\n text-align: center;\r\n opacity: 0.8;\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 768px) {\r\n .hero h1 { font-size: 3rem; }\r\n .hero .subtitle { font-size: 1.5rem; }\r\n .hero p { font-size: 1.1rem; }\r\n .about-content { grid-template-columns: 1fr; }\r\n .services-grid { grid-template-columns: 1fr; }\r\n .cta-buttons { flex-direction: column; }\r\n .nav-links { display: none; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- Floating Particles -->\r\n <div class=\"particles\">\r\n <div class=\"particle\" style=\"left: 10%; animation-delay: 0s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 20%; animation-delay: 1s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 30%; animation-delay: 2s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 40%; animation-delay: 3s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 50%; animation-delay: 4s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 60%; animation-delay: 5s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 70%; animation-delay: 6s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 80%; animation-delay: 1.5s;\"><\/div>\r\n <div class=\"particle\" style=\"left: 90%; animation-delay: 2.5s;\"><\/div>\r\n <\/div>\r\n\r\n <!-- Navigation -->\r\n <nav>\r\n <div class=\"nav-container\">\r\n <div class=\"logo\">\r\n <div class=\"logo-img\">\r\n <div style=\"width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(135deg, #66BB6A, #81C784); display: flex; align-items: center; justify-content: center; font-size: 24px;\">\ud83d\udc1d<\/div>\r\n <\/div>\r\n <span>Leafyville Media<\/span>\r\n <\/div>\r\n <ul class=\"nav-links\">\r\n <li><a href=\"#home\">Home<\/a><\/li>\r\n <li><a href=\"#about\">About<\/a><\/li>\r\n <li><a href=\"#services\">Services<\/a><\/li>\r\n <li><a href=\"#portfolio\">Portfolio<\/a><\/li>\r\n <li><a href=\"#contact\">Contact<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/nav>\r\n\r\n <!-- Hero Section -->\r\n <section id=\"home\" class=\"hero\">\r\n <div class=\"container\">\r\n <div class=\"hero-content\">\r\n <h1>Leafyville Media<\/h1>\r\n <div class=\"subtitle\">Ethereal AI Fantasy Worlds<\/div>\r\n <p>Creating breathtaking fantasy realms through the fusion of Midjourney's artistic vision and Kling AI's dynamic animations. From peaceful valley dreamscapes to mythical universes, we bring imagination to life.<\/p>\r\n <div class=\"cta-buttons\">\r\n <a href=\"#services\" class=\"cta-button\">Explore Our Worlds<\/a>\r\n <a href=\"#contact\" class=\"cta-button secondary\">Collaborate<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- About Section -->\r\n <section id=\"about\" class=\"about\">\r\n <div class=\"container\">\r\n <h2>About Our Vision<\/h2>\r\n <div class=\"about-content\">\r\n <div class=\"about-text\">\r\n <p>At Leafyville Media, we're pioneering the future of digital storytelling by harnessing the power of AI to create immersive fantasy worlds that transcend reality. Our unique approach combines cutting-edge AI technology with artistic vision to produce content that captivates audiences across social media platforms.<\/p>\r\n \r\n <p>We specialize in transforming static AI-generated imagery into living, breathing worlds through advanced animation techniques, creating ethereal experiences that transport viewers to magical realms filled with wonder and possibility.<\/p>\r\n <\/div>\r\n <div class=\"about-features\">\r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\ud83c\udfa8<\/div>\r\n <div>\r\n <h4>AI-Powered Artistry<\/h4>\r\n <p>Utilizing Midjourney for stunning visual creation<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\ud83c\udfac<\/div>\r\n <div>\r\n <h4>Dynamic Animation<\/h4>\r\n <p>Bringing images to life with Kling AI technology<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <div class=\"feature-icon\">\ud83c\udf1f<\/div>\r\n <div>\r\n <h4>Viral Content<\/h4>\r\n <p>Creating engaging content optimized for social media<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Services Section -->\r\n <section id=\"services\" class=\"services\">\r\n <div class=\"container\">\r\n <h2>Our Creative Services<\/h2>\r\n <div class=\"services-grid\">\r\n <div class=\"service-card\">\r\n <h3>Fantasy World Creation<\/h3>\r\n <p>Custom ethereal landscapes and mythical environments designed to captivate and inspire your audience.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Peaceful valley dreamscapes<\/li>\r\n <li>Magical planet environments<\/li>\r\n <li>Ethereal universe concepts<\/li>\r\n <li>Mythical realm designs<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"service-card\">\r\n <h3>AI Video Animation<\/h3>\r\n <p>Transform static AI artwork into dynamic, engaging video content perfect for social media and marketing.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Midjourney to Kling AI pipeline<\/li>\r\n <li>Smooth animation transitions<\/li>\r\n <li>Platform-optimized formats<\/li>\r\n <li>High-quality 1080p output<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"service-card\">\r\n <h3>Brand Development<\/h3>\r\n <p>Build your AI media brand with our expertise in content strategy and audience engagement.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Content strategy development<\/li>\r\n <li>AI workflow optimization<\/li>\r\n <li>Social media growth tactics<\/li>\r\n <li>Brand identity creation<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"service-card\">\r\n <h3>Custom AI Solutions<\/h3>\r\n <p>Bespoke AI content creation solutions tailored to your specific brand needs and creative vision.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Workflow consultation<\/li>\r\n <li>Tool integration<\/li>\r\n <li>Training and education<\/li>\r\n <li>Technical support<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"service-card\">\r\n <h3>Educational Content<\/h3>\r\n <p>Learn the art of AI-powered fantasy creation through comprehensive tutorials and masterclasses.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Step-by-step AI tutorials<\/li>\r\n <li>Midjourney prompt libraries<\/li>\r\n <li>Kling AI animation techniques<\/li>\r\n <li>Workflow optimization guides<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"service-card\">\r\n <h3>Digital Asset Creation<\/h3>\r\n <p>High-quality digital assets and NFT collections featuring our signature ethereal fantasy aesthetic.<\/p>\r\n <ul class=\"service-features\">\r\n <li>Limited edition art collections<\/li>\r\n <li>NFT marketplace presence<\/li>\r\n <li>Commercial use licensing<\/li>\r\n <li>Custom asset packages<\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Portfolio Preview -->\r\n <section id=\"portfolio\" class=\"portfolio\">\r\n <div class=\"container\">\r\n <h2>Featured Creations<\/h2>\r\n <div class=\"portfolio-grid\">\r\n <div class=\"portfolio-item\">\r\n <div>\ud83c\udf04 Ethereal Valley Dreamscape<\/div>\r\n <\/div>\r\n <div class=\"portfolio-item\">\r\n <div>\ud83c\udf0c Magical Planet Landscape<\/div>\r\n <\/div>\r\n <div class=\"portfolio-item\">\r\n <div>\u2728 Mystical Forest Realm<\/div>\r\n <\/div>\r\n <div class=\"portfolio-item\">\r\n <div>\ud83c\udf19 Celestial Mountain Vista<\/div>\r\n <\/div>\r\n <div class=\"portfolio-item\">\r\n <div>\ud83c\udff0 Fantasy Castle Kingdom<\/div>\r\n <\/div>\r\n <div class=\"portfolio-item\">\r\n <div>\ud83c\udf0a Otherworldly Ocean Depths<\/div>\r\n <\/div>\r\n <\/div>\r\n <div style=\"text-align: center; margin-top: 3rem;\">\r\n <a href=\"https:\/\/www.tiktok.com\/@leafyvillemedia\" target=\"_blank\" class=\"cta-button\">View Full Portfolio on TikTok<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Contact Section -->\r\n <section id=\"contact\" class=\"contact\">\r\n <div class=\"container\">\r\n <div class=\"contact-content\">\r\n <h2>Let's Create Together<\/h2>\r\n <p>Ready to expand your brand into the AI space? Let's collaborate on bringing your creative vision to life through cutting-edge AI technology and storytelling.<\/p>\r\n \r\n <div class=\"cta-buttons\" style=\"justify-content: center; margin: 2rem 0;\">\r\n <a href=\"mailto:admin@leafyville.com\" class=\"cta-button\">Get In Touch<\/a>\r\n <a href=\"https:\/\/www.tiktok.com\/@leafyvillemedia\" target=\"_blank\" class=\"cta-button secondary\">Follow Our Journey<\/a>\r\n <\/div>\r\n\r\n <div class=\"social-links\">\r\n <a href=\"https:\/\/www.tiktok.com\/@leafyvillemedia\" target=\"_blank\" class=\"social-link\" title=\"TikTok\">\ud83d\udcf1<\/a>\r\n <a href=\"https:\/\/www.youtube.com\/@Leafyvillemedia\" target=\"_blank\" class=\"social-link\" title=\"Youtube\">\ud83c\udfa5<\/a>\r\n <a href=\"mailto:admin@leafyville.com\" class=\"social-link\" title=\"Email\">\ud83d\udce7<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <!-- Footer -->\r\n <footer>\r\n <div class=\"container\">\r\n <p>© 2025 Leafyville Media. Creating ethereal worlds through AI innovation.<\/p>\r\n <\/div>\r\n <\/footer>\r\n\r\n <script>\r\n \/\/ Smooth scrolling for navigation links\r\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\r\n anchor.addEventListener('click', function (e) {\r\n e.preventDefault();\r\n const target = document.querySelector(this.getAttribute('href'));\r\n if (target) {\r\n target.scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'start'\r\n });\r\n }\r\n });\r\n });\r\n\r\n \/\/ Add more particles dynamically\r\n function createParticle() {\r\n const particle = document.createElement('div');\r\n particle.className = 'particle';\r\n particle.style.left = Math.random() * 100 + '%';\r\n particle.style.animationDelay = Math.random() * 6 + 's';\r\n particle.style.animationDuration = (Math.random() * 3 + 4) + 's';\r\n document.querySelector('.particles').appendChild(particle);\r\n \r\n \/\/ Remove particle after animation\r\n setTimeout(() => {\r\n particle.remove();\r\n }, 8000);\r\n }\r\n\r\n \/\/ Create new particles periodically\r\n setInterval(createParticle, 2000);\r\n\r\n \/\/ Intersection Observer for animations\r\n const observerOptions = {\r\n threshold: 0.1,\r\n rootMargin: '0px 0px -50px 0px'\r\n };\r\n\r\n const observer = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.isIntersecting) {\r\n entry.target.style.opacity = '1';\r\n entry.target.style.transform = 'translateY(0)';\r\n }\r\n });\r\n }, observerOptions);\r\n\r\n \/\/ Observe elements for scroll animations\r\n document.querySelectorAll('.service-card, .feature-item, .portfolio-item').forEach(el => {\r\n el.style.opacity = '0';\r\n el.style.transform = 'translateY(30px)';\r\n el.style.transition = 'all 0.6s ease';\r\n observer.observe(el);\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-79","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/pages\/79","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/leafyville.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=79"}],"version-history":[{"count":26,"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/pages\/79\/revisions"}],"predecessor-version":[{"id":111,"href":"https:\/\/leafyville.com\/index.php?rest_route=\/wp\/v2\/pages\/79\/revisions\/111"}],"wp:attachment":[{"href":"https:\/\/leafyville.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=79"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}