|
|
<!DOCTYPE html> |
|
|
<html lang="pt-BR"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>GreenLeaf Collective | Cannabis Wellness</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700;800&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Raleway', sans-serif; |
|
|
scroll-behavior: smooth; |
|
|
} |
|
|
|
|
|
.hero-section { |
|
|
height: 100vh; |
|
|
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.2)), |
|
|
url('https://images.unsplash.com/photo-1598983062491-5934abe9fcf5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80'); |
|
|
background-size: cover; |
|
|
background-position: center; |
|
|
background-attachment: fixed; |
|
|
animation: fadeIn 1.5s ease-in-out; |
|
|
} |
|
|
|
|
|
@keyframes fadeIn { |
|
|
from { opacity: 0; } |
|
|
to { opacity: 1; } |
|
|
} |
|
|
|
|
|
.nav-scrolled { |
|
|
background-color: rgba(22, 50, 34, 0.95); |
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.product-card:hover .product-image { |
|
|
transform: scale(1.05); |
|
|
transition: transform 0.3s ease; |
|
|
} |
|
|
|
|
|
.product-card:hover .quick-view { |
|
|
opacity: 1; |
|
|
transform: translateY(0); |
|
|
} |
|
|
|
|
|
.quick-view { |
|
|
opacity: 0; |
|
|
transform: translateY(10px); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.countdown-item { |
|
|
background: rgba(255, 255, 255, 0.1); |
|
|
backdrop-filter: blur(5px); |
|
|
} |
|
|
|
|
|
.parallax-section { |
|
|
background-attachment: fixed; |
|
|
background-position: center; |
|
|
background-repeat: no-repeat; |
|
|
background-size: cover; |
|
|
} |
|
|
|
|
|
.zoom-hover { |
|
|
transition: transform 0.5s ease; |
|
|
} |
|
|
|
|
|
.zoom-hover:hover { |
|
|
transform: scale(1.03); |
|
|
} |
|
|
|
|
|
.shine-effect { |
|
|
position: relative; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.shine-effect::after { |
|
|
content: ''; |
|
|
position: absolute; |
|
|
top: -50%; |
|
|
left: -60%; |
|
|
width: 20%; |
|
|
height: 200%; |
|
|
background: rgba(255, 255, 255, 0.2); |
|
|
transform: rotate(30deg); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
|
|
|
.shine-effect:hover::after { |
|
|
left: 120%; |
|
|
} |
|
|
|
|
|
.floating { |
|
|
animation: floating 3s ease-in-out infinite; |
|
|
} |
|
|
|
|
|
@keyframes floating { |
|
|
0% { transform: translateY(0px); } |
|
|
50% { transform: translateY(-15px); } |
|
|
100% { transform: translateY(0px); } |
|
|
} |
|
|
|
|
|
.pulse { |
|
|
animation: pulse 2s infinite; |
|
|
} |
|
|
|
|
|
@keyframes pulse { |
|
|
0% { transform: scale(1); } |
|
|
50% { transform: scale(1.05); } |
|
|
100% { transform: scale(1); } |
|
|
} |
|
|
|
|
|
.thc-badge { |
|
|
background: linear-gradient(135deg, #8e44ad, #9b59b6); |
|
|
} |
|
|
|
|
|
.cbd-badge { |
|
|
background: linear-gradient(135deg, #27ae60, #2ecc71); |
|
|
} |
|
|
|
|
|
.organic-badge { |
|
|
background: linear-gradient(135deg, #f39c12, #f1c40f); |
|
|
} |
|
|
|
|
|
.premium-badge { |
|
|
background: linear-gradient(135deg, #3498db, #2980b9); |
|
|
} |
|
|
|
|
|
.age-gate { |
|
|
background: rgba(22, 50, 34, 0.95); |
|
|
backdrop-filter: blur(10px); |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50"> |
|
|
|
|
|
<div class="fixed inset-0 flex items-center justify-center z-50 age-gate" id="ageVerification"> |
|
|
<div class="bg-white rounded-xl max-w-md w-full mx-4 p-8 text-center"> |
|
|
<div class="w-20 h-20 mx-auto mb-6 flex items-center justify-center bg-emerald-100 rounded-full"> |
|
|
<i class="fas fa-cannabis text-3xl text-emerald-700"></i> |
|
|
</div> |
|
|
<h2 class="text-2xl font-bold mb-4">Verificação de Idade</h2> |
|
|
<p class="text-gray-700 mb-6">Você deve ter 21 anos ou mais para acessar este site. Ao entrar, você concorda com nossos Termos de Serviço e Política de Privacidade.</p> |
|
|
|
|
|
<div class="flex flex-col space-y-4"> |
|
|
<button id="verifyAge" class="bg-emerald-700 hover:bg-emerald-800 text-white px-6 py-3 rounded-full font-bold transition"> |
|
|
Sim, sou maior de 21 anos |
|
|
</button> |
|
|
<button id="exitSite" class="bg-transparent border border-gray-300 hover:bg-gray-100 text-gray-700 px-6 py-3 rounded-full font-medium transition"> |
|
|
Não, sou menor de idade |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<p class="text-xs text-gray-500 mt-6"> |
|
|
Este site não incentiva o uso irresponsável de cannabis. A venda é restrita a maiores de 21 anos e segue as leis locais. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<nav class="fixed w-full z-40 transition-all duration-300 bg-emerald-900" id="mainNav"> |
|
|
<div class="container mx-auto px-4 py-3"> |
|
|
<div class="flex justify-between items-center"> |
|
|
<a href="#" class="text-2xl font-bold text-white shine-effect"> |
|
|
<span class="text-emerald-300">GREEN</span>LEAF |
|
|
</a> |
|
|
|
|
|
<div class="hidden md:flex space-x-8"> |
|
|
<a href="#" class="text-white hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-leaf mr-1"></i> Flores |
|
|
</a> |
|
|
<a href="#" class="text-white hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-flask mr-1"></i> Concentrados |
|
|
</a> |
|
|
<a href="#" class="text-white hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-cookie-bite mr-1"></i> Edibles |
|
|
</a> |
|
|
<a href="#" class="text-white hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-smoking mr-1"></i> Acessórios |
|
|
</a> |
|
|
<a href="#" class="text-emerald-300 font-bold hover:text-emerald-200 transition"> |
|
|
<i class="fas fa-tag mr-1"></i> Promoções |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
<div class="flex items-center space-x-4"> |
|
|
<button class="text-white hover:text-emerald-300 transition"> |
|
|
<i class="fas fa-search text-lg"></i> |
|
|
</button> |
|
|
<button class="text-white hover:text-emerald-300 transition"> |
|
|
<i class="fas fa-user text-lg"></i> |
|
|
</button> |
|
|
<button class="text-white hover:text-emerald-300 transition relative"> |
|
|
<i class="fas fa-shopping-bag text-lg"></i> |
|
|
<span class="absolute -top-2 -right-2 bg-emerald-500 text-white text-xs rounded-full h-5 w-5 flex items-center justify-center">0</span> |
|
|
</button> |
|
|
<button class="md:hidden text-white" id="mobileMenuButton"> |
|
|
<i class="fas fa-bars text-xl"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</nav> |
|
|
|
|
|
|
|
|
<div class="fixed inset-0 bg-emerald-900 bg-opacity-95 z-30 hidden" id="mobileMenu"> |
|
|
<div class="container mx-auto px-4 py-20"> |
|
|
<div class="flex flex-col space-y-6 text-center"> |
|
|
<a href="#" class="text-white text-2xl hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-leaf mr-2"></i> Flores |
|
|
</a> |
|
|
<a href="#" class="text-white text-2xl hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-flask mr-2"></i> Concentrados |
|
|
</a> |
|
|
<a href="#" class="text-white text-2xl hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-cookie-bite mr-2"></i> Edibles |
|
|
</a> |
|
|
<a href="#" class="text-white text-2xl hover:text-emerald-300 transition font-medium"> |
|
|
<i class="fas fa-smoking mr-2"></i> Acessórios |
|
|
</a> |
|
|
<a href="#" class="text-emerald-300 text-2xl font-bold hover:text-emerald-200 transition"> |
|
|
<i class="fas fa-tag mr-2"></i> Promoções |
|
|
</a> |
|
|
</div> |
|
|
<button class="absolute top-4 right-4 text-white text-2xl" id="closeMobileMenu"> |
|
|
<i class="fas fa-times"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<section class="hero-section flex items-center justify-center relative"> |
|
|
<div class="container mx-auto px-4 text-center"> |
|
|
<div class="max-w-4xl mx-auto"> |
|
|
<h1 class="text-4xl md:text-6xl font-bold text-white mb-6"> |
|
|
ELEVE SEU <span class="text-emerald-300">WELLNESS</span> |
|
|
</h1> |
|
|
<p class="text-xl text-white mb-8 opacity-90"> |
|
|
Cannabis premium cultivada com sustentabilidade e ciência. Descubra nossa seleção de produtos certificados. |
|
|
</p> |
|
|
<div class="flex justify-center space-x-4"> |
|
|
<a href="#" class="bg-emerald-600 hover:bg-emerald-700 text-white px-8 py-3 rounded-full font-bold transition transform hover:scale-105"> |
|
|
EXPLORAR PRODUTOS |
|
|
</a> |
|
|
<a href="#" class="bg-transparent border-2 border-white hover:bg-white hover:text-emerald-900 text-white px-8 py-3 rounded-full font-bold transition transform hover:scale-105"> |
|
|
CONSULTAR ESPECIALISTA |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="absolute bottom-10 left-0 right-0 text-center"> |
|
|
<a href="#featured" class="text-white animate-bounce inline-block"> |
|
|
<i class="fas fa-chevron-down text-2xl"></i> |
|
|
</a> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-white" id="featured"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="text-center mb-12"> |
|
|
<h2 class="text-3xl font-bold mb-4">NOSSOS DESTAQUES</h2> |
|
|
<div class="w-20 h-1 bg-emerald-600 mx-auto"></div> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> |
|
|
|
|
|
<div class="product-card bg-gray-50 rounded-lg overflow-hidden relative group"> |
|
|
<div class="relative overflow-hidden h-80"> |
|
|
<img src="https://images.unsplash.com/photo-1581539250439-c96689b516dd?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1065&q=80" |
|
|
alt="Sativa Haze" class="w-full h-full object-cover product-image transition duration-500"> |
|
|
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-20 transition duration-300"></div> |
|
|
<div class="quick-view absolute bottom-4 left-0 right-0 text-center"> |
|
|
<button class="bg-white text-emerald-900 px-6 py-2 rounded-full font-medium hover:bg-gray-100 transition"> |
|
|
Visualização Rápida |
|
|
</button> |
|
|
</div> |
|
|
<div class="absolute top-4 left-4 flex flex-col space-y-2"> |
|
|
<span class="thc-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
THC 22% |
|
|
</span> |
|
|
<span class="organic-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
ORGÂNICO |
|
|
</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-1">Sativa Haze</h3> |
|
|
<p class="text-gray-600 text-sm mb-2">Efeito energizante e criativo</p> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-lg font-bold">R$ 89,90</span> |
|
|
<span class="text-sm text-gray-500 line-through ml-2">R$ 109,90</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-gray-50 rounded-lg overflow-hidden relative group"> |
|
|
<div class="relative overflow-hidden h-80"> |
|
|
<img src="https://images.unsplash.com/photo-1598983062491-5934abe9fcf5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2070&q=80" |
|
|
alt="CBD Oil 1000mg" class="w-full h-full object-cover product-image transition duration-500"> |
|
|
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-20 transition duration-300"></div> |
|
|
<div class="quick-view absolute bottom-4 left-0 right-0 text-center"> |
|
|
<button class="bg-white text-emerald-900 px-6 py-2 rounded-full font-medium hover:bg-gray-100 transition"> |
|
|
Visualização Rápida |
|
|
</button> |
|
|
</div> |
|
|
<div class="absolute top-4 left-4 flex flex-col space-y-2"> |
|
|
<span class="cbd-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
CBD 1000mg |
|
|
</span> |
|
|
<span class="premium-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
PREMIUM |
|
|
</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-1">Óleo Full Spectrum</h3> |
|
|
<p class="text-gray-600 text-sm mb-2">Alívio sem psicoatividade</p> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-lg font-bold">R$ 249,90</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-gray-50 rounded-lg overflow-hidden relative group"> |
|
|
<div class="relative overflow-hidden h-80"> |
|
|
<img src="https://images.unsplash.com/photo-1606313564200-1a0e12b43068?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=987&q=80" |
|
|
alt="Gummies Relax" class="w-full h-full object-cover product-image transition duration-500"> |
|
|
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-20 transition duration-300"></div> |
|
|
<div class="quick-view absolute bottom-4 left-0 right-0 text-center"> |
|
|
<button class="bg-white text-emerald-900 px-6 py-2 rounded-full font-medium hover:bg-gray-100 transition"> |
|
|
Visualização Rápida |
|
|
</button> |
|
|
</div> |
|
|
<div class="absolute top-4 left-4 flex flex-col space-y-2"> |
|
|
<span class="thc-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
THC 10mg/un |
|
|
</span> |
|
|
<span class="organic-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
VEGANO |
|
|
</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-1">Gummies Relax</h3> |
|
|
<p class="text-gray-600 text-sm mb-2">Pacote com 20 unidades</p> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-lg font-bold">R$ 129,90</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="product-card bg-gray-50 rounded-lg overflow-hidden relative group"> |
|
|
<div class="relative overflow-hidden h-80"> |
|
|
<img src="https://images.unsplash.com/photo-1606312619470-1a0f5342b4e3?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=987&q=80" |
|
|
alt="Vaporizador Pax" class="w-full h-full object-cover product-image transition duration-500"> |
|
|
<div class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-20 transition duration-300"></div> |
|
|
<div class="quick-view absolute bottom-4 left-0 right-0 text-center"> |
|
|
<button class="bg-white text-emerald-900 px-6 py-2 rounded-full font-medium hover:bg-gray-100 transition"> |
|
|
Visualização Rápida |
|
|
</button> |
|
|
</div> |
|
|
<div class="absolute top-4 left-4"> |
|
|
<span class="premium-badge text-white text-xs font-bold px-2 py-1 rounded"> |
|
|
TECNOLOGIA |
|
|
</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<h3 class="font-bold text-lg mb-1">Vaporizador Pax 3</h3> |
|
|
<p class="text-gray-600 text-sm mb-2">Discreto e portátil</p> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-lg font-bold">R$ 899,90</span> |
|
|
<span class="text-sm text-gray-500 line-through ml-2">R$ 1.099,90</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="text-center mt-12"> |
|
|
<a href="#" class="inline-block border-2 border-emerald-900 text-emerald-900 hover:bg-emerald-900 hover:text-white px-8 py-3 rounded-full font-bold transition"> |
|
|
VER TODOS OS PRODUTOS |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-emerald-50"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="text-center mb-12"> |
|
|
<h2 class="text-3xl font-bold mb-4">BENEFÍCIOS DO CANNABIS</h2> |
|
|
<p class="text-lg text-gray-700">Descubra como a cannabis pode contribuir para seu bem-estar</p> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition text-center"> |
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-emerald-100 rounded-full flex items-center justify-center"> |
|
|
<i class="fas fa-brain text-2xl text-emerald-700"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Saúde Mental</h3> |
|
|
<p class="text-gray-700"> |
|
|
Estudos mostram que o CBD pode ajudar no gerenciamento de ansiedade, estresse e qualidade do sono. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition text-center"> |
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-emerald-100 rounded-full flex items-center justify-center"> |
|
|
<i class="fas fa-bone text-2xl text-emerald-700"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Alívio da Dor</h3> |
|
|
<p class="text-gray-700"> |
|
|
Eficaz no tratamento de dores crônicas, inflamações e condições como artrite e fibromialgia. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition text-center"> |
|
|
<div class="w-16 h-16 mx-auto mb-4 bg-emerald-100 rounded-full flex items-center justify-center"> |
|
|
<i class="fas fa-heartbeat text-2xl text-emerald-700"></i> |
|
|
</div> |
|
|
<h3 class="font-bold text-xl mb-2">Saúde Física</h3> |
|
|
<p class="text-gray-700"> |
|
|
Pode auxiliar no controle de náuseas, estimular o apetite e ajudar em tratamentos como quimioterapia. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="text-center mt-12"> |
|
|
<a href="#" class="inline-block bg-emerald-700 hover:bg-emerald-800 text-white px-8 py-3 rounded-full font-bold transition"> |
|
|
APRENDA MAIS NO NOSSO BLOG |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 parallax-section" style="background-image: url('https://images.unsplash.com/photo-1605000797499-95a51c5269ae?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2071&q=80');"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="max-w-2xl mx-auto bg-white bg-opacity-90 backdrop-filter backdrop-blur-sm rounded-xl p-8 shadow-lg"> |
|
|
<h2 class="text-3xl font-bold mb-6 text-center">CULTIVO SUSTENTÁVEL</h2> |
|
|
<p class="text-gray-700 mb-4"> |
|
|
Na GreenLeaf, priorizamos práticas agrícolas regenerativas que respeitam o meio ambiente. Nossas plantas são cultivadas sem pesticidas sintéticos, usando apenas nutrientes orgânicos e controle biológico de pragas. |
|
|
</p> |
|
|
<p class="text-gray-700 mb-6"> |
|
|
Acreditamos que cannabis de qualidade começa com um solo saudável e práticas éticas de cultivo. Todos os nossos produtos passam por rigorosos testes de laboratório para garantir pureza e potência. |
|
|
</p> |
|
|
<div class="text-center"> |
|
|
<a href="#" class="inline-block bg-emerald-700 hover:bg-emerald-800 text-white px-8 py-3 rounded-full font-bold transition"> |
|
|
CONHEÇA NOSSO PROCESSO |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-gray-100"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="text-center mb-12"> |
|
|
<h2 class="text-3xl font-bold mb-4">DEPOIMENTOS VERIFICADOS</h2> |
|
|
<div class="w-20 h-1 bg-emerald-600 mx-auto"></div> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="text-yellow-400 text-xl"> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-700 mb-4"> |
|
|
"O óleo de CBD mudou minha vida. Depois de anos sofrendo com ansiedade, finalmente encontrei alívio sem efeitos colaterais." |
|
|
</p> |
|
|
<div class="flex items-center"> |
|
|
<img src="https://randomuser.me/api/portraits/women/32.jpg" alt="Ana Santos" class="w-10 h-10 rounded-full mr-3"> |
|
|
<div> |
|
|
<h4 class="font-bold">Ana Santos</h4> |
|
|
<p class="text-gray-600 text-sm">Cliente desde 2022</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="text-yellow-400 text-xl"> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star-half-alt"></i> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-700 mb-4"> |
|
|
"A qualidade das flores é incomparável. Frescor, aroma e efeito consistentes. Minha fonte confiável para cannabis medicinal." |
|
|
</p> |
|
|
<div class="flex items-center"> |
|
|
<img src="https://randomuser.me/api/portraits/men/44.jpg" alt="Carlos Mendes" class="w-10 h-10 rounded-full mr-3"> |
|
|
<div> |
|
|
<h4 class="font-bold">Carlos Mendes</h4> |
|
|
<p class="text-gray-600 text-sm">Paciente medicinal</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white p-6 rounded-lg shadow-md hover:shadow-lg transition"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<div class="text-yellow-400 text-xl"> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
<i class="fas fa-star"></i> |
|
|
</div> |
|
|
</div> |
|
|
<p class="text-gray-700 mb-4"> |
|
|
"Atendimento excepcional e produtos de altíssima qualidade. Os gummies são perfeitos para dosagem precisa e discreta." |
|
|
</p> |
|
|
<div class="flex items-center"> |
|
|
<img src="https://randomuser.me/api/portraits/women/75.jpg" alt="Juliana Oliveira" class="w-10 h-10 rounded-full mr-3"> |
|
|
<div> |
|
|
<h4 class="font-bold">Juliana Oliveira</h4> |
|
|
<p class="text-gray-600 text-sm">Cliente premium</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-16 bg-emerald-900 text-white"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="max-w-3xl mx-auto text-center"> |
|
|
<h2 class="text-3xl font-bold mb-4">JUNTE-SE À NOSSA COMUNIDADE</h2> |
|
|
<p class="text-emerald-200 mb-8"> |
|
|
Cadastre-se para receber conteúdos exclusivos, ofertas especiais e as últimas novidades sobre cannabis medicinal e wellness. |
|
|
</p> |
|
|
<form class="flex flex-col md:flex-row gap-4 max-w-xl mx-auto"> |
|
|
<input type="email" placeholder="Seu melhor e-mail" |
|
|
class="flex-1 px-4 py-3 rounded-full text-gray-900 focus:outline-none focus:ring-2 focus:ring-emerald-500"> |
|
|
<button type="submit" |
|
|
class="bg-emerald-600 hover:bg-emerald-700 px-6 py-3 rounded-full font-bold transition transform hover:scale-105"> |
|
|
ASSINAR |
|
|
</button> |
|
|
</form> |
|
|
<p class="text-emerald-300 text-sm mt-4"> |
|
|
Respeitamos sua privacidade. Consulte nossa <a href="#" class="text-white hover:underline">Política de Privacidade</a>. |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-900 text-white py-12"> |
|
|
<div class="container mx-auto px-4"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8"> |
|
|
<div> |
|
|
<h3 class="text-xl font-bold mb-4">GREENLEAF COLLECTIVE</h3> |
|
|
<p class="text-gray-400 mb-4"> |
|
|
Tecnologia e natureza trabalhando juntas para seu bem-estar. |
|
|
</p> |
|
|
<div class="flex space-x-4"> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-facebook-f"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-instagram"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-twitter"></i> |
|
|
</a> |
|
|
<a href="#" class="text-gray-400 hover:text-white transition"> |
|
|
<i class="fab fa-youtube"></i> |
|
|
</a> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h4 class="font-bold mb-4">PRODUTOS</h4> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Flores</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Concentrados</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Edibles</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Acessórios</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Kits Wellness</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h4 class="font-bold mb-4">INFORMAÇÕES</h4> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Blog Educativo</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Guia de Dosagem</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Perguntas Frequentes</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Termos de Serviço</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Política de Privacidade</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<h4 class="font-bold mb-4">ATENDIMENTO</h4> |
|
|
<ul class="space-y-2 text-gray-400"> |
|
|
<li class="flex items-start"> |
|
|
<i class="fas fa-map-marker-alt mt-1 mr-2"></i> |
|
|
<span>Av. das Flores, 420 - São Paulo/SP</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-phone-alt mr-2"></i> |
|
|
<span>(11) 4200-6969</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-envelope mr-2"></i> |
|
|
<span>[email protected]</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-clock mr-2"></i> |
|
|
<span>Seg-Sex: 9h-18h</span> |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fab fa-trello mr-2"></i> |
|
|
<a href="https://trello.com/b/2aGtz8Ds/ecommerce2" target="_blank" class="text-gray-400 hover:text-white transition"> |
|
|
Nosso Trello |
|
|
</a> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-gray-800 pt-8"> |
|
|
<div class="flex flex-col md:flex-row justify-between items-center"> |
|
|
<div class="mb-4 md:mb-0"> |
|
|
<p class="text-gray-400 text-sm"> |
|
|
© 2024 GreenLeaf Collective. Todos os direitos reservados. |
|
|
</p> |
|
|
<p class="text-gray-500 text-xs mt-1"> |
|
|
A venda de cannabis é restrita a maiores de 21 anos. Consulte a legislação da sua região. |
|
|
</p> |
|
|
</div> |
|
|
<div class="flex space-x-6"> |
|
|
<img src="https://via.placeholder.com/40x25?text=Visa" alt="Visa" class="h-6"> |
|
|
<img src="https://via.placeholder.com/40x25?text=Master" alt="Mastercard" class="h-6"> |
|
|
<img src="https://via.placeholder.com/40x25?text=BTC" alt="Bitcoin" class="h-6"> |
|
|
<img src="https://via.placeholder.com/40x25?text=Pix" alt="Pix" class="h-6"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
|
|
|
<a href="#" class="fixed bottom-6 right-6 bg-green-500 hover:bg-green-600 text-white rounded-full p-4 shadow-xl transition transform hover:scale-110 z-50"> |
|
|
<i class="fab fa-whatsapp text-2xl"></i> |
|
|
</a> |
|
|
|
|
|
|
|
|
<a href="#" id="backToTop" class="fixed bottom-24 right-6 bg-emerald-700 hover:bg-emerald-800 text-white rounded-full p-3 shadow-xl transition transform hover:scale-110 z-50 hidden"> |
|
|
<i class="fas fa-arrow-up"></i> |
|
|
</a> |
|
|
|
|
|
<script> |
|
|
|
|
|
const ageVerified = localStorage.getItem('ageVerified'); |
|
|
const ageVerification = document.getElementById('ageVerification'); |
|
|
const verifyAge = document.getElementById('verifyAge'); |
|
|
const exitSite = document.getElementById('exitSite'); |
|
|
|
|
|
if (!ageVerified) { |
|
|
ageVerification.classList.remove('hidden'); |
|
|
document.body.style.overflow = 'hidden'; |
|
|
} |
|
|
|
|
|
verifyAge.addEventListener('click', () => { |
|
|
localStorage.setItem('ageVerified', 'true'); |
|
|
ageVerification.classList.add('hidden'); |
|
|
document.body.style.overflow = ''; |
|
|
}); |
|
|
|
|
|
exitSite.addEventListener('click', () => { |
|
|
window.location.href = 'https://www.google.com'; |
|
|
}); |
|
|
|
|
|
|
|
|
const mobileMenuButton = document.getElementById('mobileMenuButton'); |
|
|
const mobileMenu = document.getElementById('mobileMenu'); |
|
|
const closeMobileMenu = document.getElementById('closeMobileMenu'); |
|
|
|
|
|
mobileMenuButton.addEventListener('click', () => { |
|
|
mobileMenu.classList.remove('hidden'); |
|
|
document.body.style.overflow = 'hidden'; |
|
|
}); |
|
|
|
|
|
closeMobileMenu.addEventListener('click', () => { |
|
|
mobileMenu.classList.add('hidden'); |
|
|
document.body.style.overflow = ''; |
|
|
}); |
|
|
|
|
|
|
|
|
window.addEventListener('scroll', () => { |
|
|
const nav = document.getElementById('mainNav'); |
|
|
if (window.scrollY > 50) { |
|
|
nav.classList.add('nav-scrolled'); |
|
|
} else { |
|
|
nav.classList.remove('nav-scrolled'); |
|
|
} |
|
|
|
|
|
|
|
|
const backToTop = document.getElementById('backToTop'); |
|
|
if (window.scrollY > 300) { |
|
|
backToTop.classList.remove('hidden'); |
|
|
} else { |
|
|
backToTop.classList.add('hidden'); |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
|
|
anchor.addEventListener('click', function(e) { |
|
|
e.preventDefault(); |
|
|
|
|
|
const targetId = this.getAttribute('href'); |
|
|
if (targetId === '#') return; |
|
|
|
|
|
const targetElement = document.querySelector(targetId); |
|
|
if (targetElement) { |
|
|
window.scrollTo({ |
|
|
top: targetElement.offsetTop - 80, |
|
|
behavior: 'smooth' |
|
|
}); |
|
|
|
|
|
|
|
|
if (!mobileMenu.classList.contains('hidden')) { |
|
|
mobileMenu.classList.add('hidden'); |
|
|
document.body.style.overflow = ''; |
|
|
} |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.product-image').forEach(image => { |
|
|
image.addEventListener('mousemove', (e) => { |
|
|
const { left, top, width, height } = image.getBoundingClientRect(); |
|
|
const x = (e.clientX - left) / width * 100; |
|
|
const y = (e.clientY - top) / height * 100; |
|
|
image.style.transformOrigin = `${x}% ${y}%`; |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=R87/pecas" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
