initial: bootstrap from BukidBountyApp base
This commit is contained in:
699
database/seeders/LandingPageSeeder.php
Normal file
699
database/seeders/LandingPageSeeder.php
Normal file
@@ -0,0 +1,699 @@
|
||||
<?php
|
||||
|
||||
use App\Models\LandingPage;
|
||||
|
||||
class LandingPageSeeder extends \Hyperf\Database\Seeders\Seeder
|
||||
{
|
||||
public function run(): void
|
||||
{
|
||||
foreach ($this->templates() as $tpl) {
|
||||
$existing = LandingPage::where('title', $tpl['title'])->first();
|
||||
if ($existing) {
|
||||
$existing->update([
|
||||
'html_content' => $tpl['html_content'],
|
||||
'description' => $tpl['description'],
|
||||
]);
|
||||
} else {
|
||||
LandingPage::create([
|
||||
'title' => $tpl['title'],
|
||||
'html_content' => $tpl['html_content'],
|
||||
'description' => $tpl['description'],
|
||||
'is_active' => false,
|
||||
]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private function templates(): array
|
||||
{
|
||||
return [
|
||||
[
|
||||
'title' => 'Bigkis Inc | Bisigco',
|
||||
'description' => 'National agricultural cooperative landing page — Bigkis Inc & Bisigco (Philippines).',
|
||||
'html_content' => $this->bigkisTemplate(),
|
||||
],
|
||||
[
|
||||
'title' => 'Bigkis Inc | Bisigco v2',
|
||||
'description' => 'Modern, dynamic, and premium landing page for Bigkis Inc & Bisigco.',
|
||||
'html_content' => $this->bigkisTemplateV2(),
|
||||
],
|
||||
];
|
||||
}
|
||||
|
||||
private function bigkisTemplate(): string
|
||||
{
|
||||
return <<<'HTML'
|
||||
<section style="background: linear-gradient(135deg, #0038a8 0%, #0a4dbd 50%, #ce1126 100%); color: #fff; padding: 80px 20px; text-align: center; position: relative; overflow: hidden;">
|
||||
<div style="position: absolute; inset: 0; background: radial-gradient(circle at 20% 30%, rgba(252,209,22,0.18) 0%, transparent 50%), radial-gradient(circle at 80% 70%, rgba(255,255,255,0.12) 0%, transparent 50%);"></div>
|
||||
<div style="position: relative; max-width: 1100px; margin: 0 auto;">
|
||||
<div style="display: flex; justify-content: center; align-items: center; gap: 24px; margin-bottom: 24px;">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bigkis_logo.jpg" alt="Bigkis Inc Logo" style="width: 180px; height: 180px; border-radius: 50%; background: #fff; padding: 8px; box-shadow: 0 12px 40px rgba(0,0,0,0.35); object-fit: cover;">
|
||||
<div style="width: 3px; height: 120px; background: rgba(252,209,22,0.8); border-radius: 2px;"></div>
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bisigco.png" alt="Bisigco Logo" style="width: 180px; height: 180px; border-radius: 50%; background: #fff; padding: 8px; box-shadow: 0 12px 40px rgba(0,0,0,0.35); object-fit: cover;">
|
||||
</div>
|
||||
<div style="display: inline-block; background: rgba(252,209,22,0.95); color: #0038a8; padding: 6px 18px; border-radius: 999px; font-weight: 800; font-size: 0.85rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 16px;">Est. 2022 · Philippines</div>
|
||||
<h1 style="font-size: 3.25rem; font-weight: 900; margin-bottom: 12px; line-height: 1.05; text-shadow: 0 4px 20px rgba(0,0,0,0.3);">BIGKIS INC <span style="opacity: 0.85;">|</span> BISIGCO</h1>
|
||||
<p style="font-size: 1.35rem; font-weight: 700; color: #fcd116; margin-bottom: 8px; letter-spacing: 0.05em;">Bigkis Bayanihang Masa · Sincere Advocacy · Responsible Action</p>
|
||||
<p style="font-size: 1.1rem; max-width: 760px; margin: 0 auto 36px; opacity: 0.95; line-height: 1.6;">A national agricultural cooperative uniting <strong style="color: #fcd116;">over 1 million members worldwide</strong> — empowering Filipino farmers, growers, and communities through unity, livelihood, and shared prosperity.</p>
|
||||
<div style="display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;">
|
||||
<a href="/login" style="display: inline-block; background: #fcd116; color: #0038a8; padding: 16px 42px; border-radius: 50px; font-weight: 800; text-decoration: none; font-size: 1.05rem; box-shadow: 0 8px 24px rgba(252,209,22,0.45);">Become a Member</a>
|
||||
<a href="#about" style="display: inline-block; background: rgba(255,255,255,0.15); color: #fff; padding: 16px 42px; border-radius: 50px; font-weight: 800; text-decoration: none; font-size: 1.05rem; border: 2px solid rgba(255,255,255,0.4); backdrop-filter: blur(8px);">Learn More</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="background: #fff; padding: 30px 20px; border-bottom: 4px solid #fcd116;">
|
||||
<div style="max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; text-align: center;">
|
||||
<div><div style="font-size: 2.4rem; font-weight: 900; color: #0038a8;">1M+</div><div style="font-size: 0.9rem; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;">Members Worldwide</div></div>
|
||||
<div><div style="font-size: 2.4rem; font-weight: 900; color: #ce1126;">81</div><div style="font-size: 0.9rem; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;">Provinces Reached</div></div>
|
||||
<div><div style="font-size: 2.4rem; font-weight: 900; color: #0a8a3e;">100%</div><div style="font-size: 0.9rem; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;">Filipino-Led</div></div>
|
||||
<div><div style="font-size: 2.4rem; font-weight: 900; color: #b8860b;">2022</div><div style="font-size: 0.9rem; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em;">Year Established</div></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="about" style="padding: 80px 20px; background: linear-gradient(180deg, #f7faff 0%, #fff 100%);">
|
||||
<div style="max-width: 1100px; margin: 0 auto;">
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 48px; align-items: center;">
|
||||
<div>
|
||||
<div style="display: inline-block; color: #ce1126; font-weight: 800; font-size: 0.9rem; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 12px;">About the Cooperative</div>
|
||||
<h2 style="font-size: 2.4rem; font-weight: 900; color: #0038a8; margin-bottom: 18px; line-height: 1.15;">Unity in Action. Livelihood for All.</h2>
|
||||
<p style="font-size: 1.05rem; line-height: 1.75; color: #333; margin-bottom: 16px;"><strong>Bigkis Inc</strong> (Bigkis Bayanihang Masa, Sincere Advocacy, Responsible Action Incorporated) is a nationwide cooperative movement built on the Filipino spirit of <em>bayanihan</em> — collective effort for the common good.</p>
|
||||
<p style="font-size: 1.05rem; line-height: 1.75; color: #333; margin-bottom: 16px;">Together with <strong>BISIGCO</strong> (Bigkis Agri-Livelihood & Growers Cooperative), we provide farmers, fisherfolk, and growers with access to markets, fair pricing, capacity-building, and dignified livelihood opportunities.</p>
|
||||
<p style="font-size: 1.05rem; line-height: 1.75; color: #333;">From rice paddies in Luzon to upland farms in Mindanao, our members stand united — feeding the nation and uplifting their families.</p>
|
||||
</div>
|
||||
<div style="text-align: center;">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bigkis_bisigco.jpg" alt="Bigkis Inc and Bisigco — Unity in Action, Livelihood for All" style="width: 100%; max-width: 520px; border-radius: 20px; box-shadow: 0 20px 50px rgba(0,56,168,0.25);">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="padding: 80px 20px; background: #fff;">
|
||||
<div style="max-width: 1100px; margin: 0 auto;">
|
||||
<div style="text-align: center; margin-bottom: 48px;">
|
||||
<div style="display: inline-block; color: #0a8a3e; font-weight: 800; font-size: 0.9rem; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 12px;">Our Programs</div>
|
||||
<h2 style="font-size: 2.2rem; font-weight: 900; color: #0038a8; margin: 0;">What We Do for Our Members</h2>
|
||||
</div>
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px;">
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #0038a8;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">🌾</div>
|
||||
<h3 style="font-weight: 800; color: #0038a8; margin-bottom: 10px; font-size: 1.2rem;">Agri-Livelihood</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">Farm inputs, training, and market access for rice, corn, vegetables, livestock, and high-value crops.</p>
|
||||
</div>
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #ce1126;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">🤝</div>
|
||||
<h3 style="font-weight: 800; color: #ce1126; margin-bottom: 10px; font-size: 1.2rem;">Bayanihan Network</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">A nationwide grassroots network connecting members across barangays, municipalities, and provinces.</p>
|
||||
</div>
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #fcd116;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">💰</div>
|
||||
<h3 style="font-weight: 800; color: #b8860b; margin-bottom: 10px; font-size: 1.2rem;">Fair Trade Marketplace</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">Direct-to-consumer selling that removes middlemen and ensures fair prices for growers.</p>
|
||||
</div>
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #0a8a3e;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">📚</div>
|
||||
<h3 style="font-weight: 800; color: #0a8a3e; margin-bottom: 10px; font-size: 1.2rem;">Capacity Building</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">Skills training, financial literacy, and modern farming workshops for sustainable growth.</p>
|
||||
</div>
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #6f42c1;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">🛡️</div>
|
||||
<h3 style="font-weight: 800; color: #6f42c1; margin-bottom: 10px; font-size: 1.2rem;">Member Protection</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">Cooperative insurance, mutual aid, and advocacy for farmers' rights at every level of government.</p>
|
||||
</div>
|
||||
<div style="background: #fff; padding: 36px 28px; border-radius: 18px; box-shadow: 0 8px 30px rgba(0,56,168,0.08); border-top: 5px solid #17a2b8;">
|
||||
<div style="font-size: 2.8rem; margin-bottom: 14px;">🌏</div>
|
||||
<h3 style="font-weight: 800; color: #17a2b8; margin-bottom: 10px; font-size: 1.2rem;">Global OFW Bridge</h3>
|
||||
<p style="color: #555; line-height: 1.65; margin: 0;">Connecting overseas Filipinos with cooperative ventures back home — investment with impact.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="padding: 80px 20px; background: linear-gradient(135deg, #0038a8 0%, #0a4dbd 100%); color: #fff;">
|
||||
<div style="max-width: 1000px; margin: 0 auto; text-align: center;">
|
||||
<div style="font-size: 4rem; line-height: 1; opacity: 0.4; margin-bottom: -10px;">“</div>
|
||||
<p style="font-size: 1.5rem; font-weight: 600; line-height: 1.5; max-width: 800px; margin: 0 auto 28px; font-style: italic;">When Filipinos stand together — farmer beside farmer, neighbor beside neighbor — no challenge is too great. This is the spirit of <span style="color: #fcd116;">Bigkis</span>.</p>
|
||||
<div style="width: 60px; height: 3px; background: #fcd116; margin: 0 auto 16px;"></div>
|
||||
<div style="font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.9rem; opacity: 0.9;">— The Bigkis Inc Movement</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section style="padding: 80px 20px; background: #fcd116; text-align: center;">
|
||||
<div style="max-width: 800px; margin: 0 auto;">
|
||||
<h2 style="font-size: 2.4rem; font-weight: 900; color: #0038a8; margin-bottom: 14px;">Join the Movement</h2>
|
||||
<p style="font-size: 1.15rem; color: #1a1a2e; margin-bottom: 32px; line-height: 1.6;">Become part of a million-strong cooperative reshaping Philippine agriculture — one bayanihan at a time.</p>
|
||||
<div style="display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;">
|
||||
<a href="/login" style="display: inline-block; background: #0038a8; color: #fff; padding: 16px 44px; border-radius: 50px; font-weight: 800; text-decoration: none; font-size: 1.05rem; box-shadow: 0 8px 24px rgba(0,56,168,0.35);">Member Login / Sign Up</a>
|
||||
<a href="/login" style="display: inline-block; background: #ce1126; color: #fff; padding: 16px 44px; border-radius: 50px; font-weight: 800; text-decoration: none; font-size: 1.05rem; box-shadow: 0 8px 24px rgba(206,17,38,0.35);">Apply for Membership</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer style="background: #1a1a2e; color: #b8c0d0; padding: 48px 20px 28px;">
|
||||
<div style="max-width: 1100px; margin: 0 auto;">
|
||||
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 32px; margin-bottom: 32px;">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center; gap: 12px; margin-bottom: 14px;">
|
||||
<div style="display: flex; gap: 8px;">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bigkis_logo.jpg" alt="Bigkis Inc" style="width: 56px; height: 56px; border-radius: 50%; background: #fff; padding: 4px;">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bisigco.png" alt="Bisigco" style="width: 56px; height: 56px; border-radius: 50%; background: #fff; padding: 4px;">
|
||||
</div>
|
||||
<div>
|
||||
<div style="font-weight: 900; color: #fff; font-size: 1.05rem;">BIGKIS INC</div>
|
||||
<div style="font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: #fcd116;">Est. 2022</div>
|
||||
</div>
|
||||
</div>
|
||||
<p style="font-size: 0.9rem; line-height: 1.6; margin: 0;">Bigkis Bayanihang Masa, Sincere Advocacy, Responsible Action Incorporated — a national agricultural cooperative serving Filipino farmers and communities.</p>
|
||||
</div>
|
||||
<div>
|
||||
<div style="font-weight: 800; color: #fff; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.85rem; margin-bottom: 12px;">Cooperative</div>
|
||||
<div style="display: flex; flex-direction: column; gap: 8px; font-size: 0.92rem;">
|
||||
<a href="#about" style="color: #b8c0d0; text-decoration: none;">About Bigkis</a>
|
||||
<a href="#" style="color: #b8c0d0; text-decoration: none;">BISIGCO Programs</a>
|
||||
<a href="#" style="color: #b8c0d0; text-decoration: none;">Membership</a>
|
||||
<a href="#" style="color: #b8c0d0; text-decoration: none;">Governance</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div style="font-weight: 800; color: #fff; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.85rem; margin-bottom: 12px;">Connect</div>
|
||||
<div style="display: flex; flex-direction: column; gap: 8px; font-size: 0.92rem;">
|
||||
<span>📍 Republic of the Philippines</span>
|
||||
<span>✉️ info@bigkis.ph</span>
|
||||
<span>📞 Member Hotline</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="border-top: 1px solid rgba(255,255,255,0.1); padding-top: 20px; text-align: center; font-size: 0.85rem;">
|
||||
© 2026 Bigkis Inc & BISIGCO — Unity in Action. Livelihood for All. 🇵🇭
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
HTML;
|
||||
}
|
||||
|
||||
private function bigkisTemplateV2(): string
|
||||
{
|
||||
return <<<'HTML'
|
||||
<div class="v2-landing">
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800;900&display=swap');
|
||||
|
||||
.v2-landing {
|
||||
font-family: 'Outfit', sans-serif;
|
||||
color: #1e293b;
|
||||
line-height: 1.6;
|
||||
overflow-x: hidden;
|
||||
background-color: #f8fafc;
|
||||
}
|
||||
|
||||
.v2-landing * {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.v2-hero {
|
||||
position: relative;
|
||||
padding: 160px 20px 200px;
|
||||
background: #0f172a;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.v2-hero::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -50%; left: -50%;
|
||||
width: 200%; height: 200%;
|
||||
background: radial-gradient(circle at 30% 30%, rgba(0,56,168,0.5) 0%, transparent 40%),
|
||||
radial-gradient(circle at 70% 70%, rgba(206,17,38,0.4) 0%, transparent 40%);
|
||||
animation: v2-rotateBg 25s linear infinite;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
@keyframes v2-rotateBg {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
.v2-hero-content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
max-width: 1000px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||
.v2-glass-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
backdrop-filter: blur(12px);
|
||||
-webkit-backdrop-filter: blur(12px);
|
||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
||||
border-radius: 50px;
|
||||
padding: 8px 24px;
|
||||
font-weight: 600;
|
||||
font-size: 0.9rem;
|
||||
letter-spacing: 1px;
|
||||
text-transform: uppercase;
|
||||
color: #fcd116;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
.v2-logos {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 32px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.v2-logo-wrap {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
padding: 6px;
|
||||
box-shadow: 0 0 30px rgba(252,209,22,0.2);
|
||||
transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.5s ease;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.v2-logo-wrap:hover {
|
||||
transform: translateY(-10px) scale(1.08);
|
||||
box-shadow: 0 20px 40px rgba(252,209,22,0.5);
|
||||
}
|
||||
|
||||
.v2-logo-wrap img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.v2-divider {
|
||||
width: 3px;
|
||||
height: 60px;
|
||||
background: #fcd116;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 0 15px #fcd116;
|
||||
}
|
||||
|
||||
.v2-title {
|
||||
font-size: 5rem;
|
||||
font-weight: 900;
|
||||
line-height: 1.1;
|
||||
margin: 0;
|
||||
background: linear-gradient(135deg, #ffffff 0%, #cbd5e1 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: -2px;
|
||||
text-shadow: 0 10px 30px rgba(0,0,0,0.3);
|
||||
}
|
||||
|
||||
.v2-subtitle {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
color: #fcd116;
|
||||
margin: 0;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.v2-desc {
|
||||
font-size: 1.25rem;
|
||||
color: #e2e8f0;
|
||||
max-width: 750px;
|
||||
font-weight: 300;
|
||||
line-height: 1.8;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.v2-actions {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.v2-btn-primary {
|
||||
background: #fcd116;
|
||||
color: #0038a8;
|
||||
padding: 18px 48px;
|
||||
border-radius: 50px;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
box-shadow: 0 10px 30px rgba(252,209,22,0.4);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.v2-btn-primary:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 15px 40px rgba(252,209,22,0.6);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.v2-btn-secondary {
|
||||
background: transparent;
|
||||
color: #fff;
|
||||
padding: 16px 46px;
|
||||
border-radius: 50px;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
transition: all 0.3s ease;
|
||||
border: 2px solid rgba(255,255,255,0.3);
|
||||
backdrop-filter: blur(10px);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.v2-btn-secondary:hover {
|
||||
background: rgba(255,255,255,0.15);
|
||||
border-color: #fff;
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
|
||||
.v2-stats {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||
gap: 30px;
|
||||
max-width: 1200px;
|
||||
margin: -100px auto 0;
|
||||
padding: 0 20px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.v2-stat-card {
|
||||
background: #fff;
|
||||
border-radius: 24px;
|
||||
padding: 40px 20px;
|
||||
text-align: center;
|
||||
box-shadow: 0 20px 50px rgba(0,0,0,0.1);
|
||||
transition: transform 0.4s ease, box-shadow 0.4s ease;
|
||||
border-bottom: 6px solid #0038a8;
|
||||
}
|
||||
|
||||
.v2-stat-card:hover {
|
||||
transform: translateY(-15px);
|
||||
box-shadow: 0 30px 60px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
.v2-stat-val {
|
||||
font-size: 3.5rem;
|
||||
font-weight: 900;
|
||||
color: #0038a8;
|
||||
margin-bottom: 8px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.v2-stat-label {
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
color: #64748b;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1.5px;
|
||||
}
|
||||
|
||||
.v2-stat-card:nth-child(2) { border-color: #ce1126; }
|
||||
.v2-stat-card:nth-child(2) .v2-stat-val { color: #ce1126; }
|
||||
|
||||
.v2-stat-card:nth-child(3) { border-color: #10b981; }
|
||||
.v2-stat-card:nth-child(3) .v2-stat-val { color: #10b981; }
|
||||
|
||||
.v2-stat-card:nth-child(4) { border-color: #f59e0b; }
|
||||
.v2-stat-card:nth-child(4) .v2-stat-val { color: #f59e0b; }
|
||||
|
||||
.v2-section {
|
||||
padding: 120px 20px;
|
||||
}
|
||||
|
||||
.v2-container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.v2-header {
|
||||
text-align: center;
|
||||
margin-bottom: 70px;
|
||||
}
|
||||
|
||||
.v2-tag {
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
background: rgba(0,56,168,0.08);
|
||||
color: #0038a8;
|
||||
border-radius: 50px;
|
||||
font-weight: 800;
|
||||
font-size: 0.95rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.v2-h2 {
|
||||
font-size: 3.5rem;
|
||||
font-weight: 900;
|
||||
color: #0f172a;
|
||||
margin: 0;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.v2-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
|
||||
gap: 40px;
|
||||
}
|
||||
|
||||
.v2-card {
|
||||
background: #fff;
|
||||
border-radius: 30px;
|
||||
padding: 48px 40px;
|
||||
box-shadow: 0 10px 30px rgba(0,0,0,0.04);
|
||||
transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.v2-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 0; width: 100%; height: 100%;
|
||||
background: linear-gradient(135deg, rgba(0,56,168,0.05) 0%, transparent 100%);
|
||||
z-index: -1;
|
||||
opacity: 0;
|
||||
transition: opacity 0.4s ease;
|
||||
}
|
||||
|
||||
.v2-card:hover {
|
||||
transform: translateY(-20px);
|
||||
box-shadow: 0 30px 60px rgba(0,56,168,0.1);
|
||||
}
|
||||
|
||||
.v2-card:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.v2-icon {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background: #f8fafc;
|
||||
border-radius: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: inset 0 2px 10px rgba(0,0,0,0.05);
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
|
||||
.v2-card:hover .v2-icon {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
}
|
||||
|
||||
.v2-card-title {
|
||||
font-size: 1.7rem;
|
||||
font-weight: 800;
|
||||
margin-bottom: 16px;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
.v2-card-desc {
|
||||
color: #64748b;
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.7;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.v2-cta {
|
||||
background: linear-gradient(135deg, #0038a8 0%, #1e3a8a 100%);
|
||||
padding: 120px 20px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
border-radius: 40px;
|
||||
margin: 0 20px 100px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.v2-cta::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0; bottom: 0;
|
||||
background: url('data:image/svg+xml;utf8,<svg width="60" height="60" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg"><circle cx="30" cy="30" r="20" stroke="rgba(255,255,255,0.05)" stroke-width="1.5" fill="none"/></svg>') 0 0 / 60px 60px;
|
||||
}
|
||||
|
||||
.v2-cta-content {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.v2-cta-title {
|
||||
font-size: 3.5rem;
|
||||
font-weight: 900;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.v2-cta-desc {
|
||||
font-size: 1.3rem;
|
||||
color: #bfdbfe;
|
||||
margin-bottom: 40px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.v2-title { font-size: 3.2rem; }
|
||||
.v2-subtitle { font-size: 1.2rem; }
|
||||
.v2-hero { padding: 120px 20px 160px; }
|
||||
.v2-h2 { font-size: 2.5rem; }
|
||||
.v2-cta-title { font-size: 2.5rem; }
|
||||
.v2-logos { flex-direction: column; gap: 20px; }
|
||||
.v2-divider { width: 60px; height: 3px; }
|
||||
}
|
||||
</style>
|
||||
|
||||
<header class="v2-hero">
|
||||
<div class="v2-hero-content">
|
||||
<div class="v2-glass-badge">
|
||||
<span style="font-size:1.2rem">🌟</span> Premium Design Interface
|
||||
</div>
|
||||
|
||||
<div class="v2-logos">
|
||||
<div class="v2-logo-wrap">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bigkis_logo.jpg" alt="Bigkis Inc">
|
||||
</div>
|
||||
<div class="v2-divider"></div>
|
||||
<div class="v2-logo-wrap">
|
||||
<img src="https://cdn.jsdelivr.net/gh/telemagnadon/publicforCDN@latest/assets/bisigco.png" alt="Bisigco">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h1 class="v2-title">Bigkis <span style="opacity:0.5;font-weight:300;">|</span> Bisigco</h1>
|
||||
<h2 class="v2-subtitle">Sincere Advocacy · Responsible Action</h2>
|
||||
</div>
|
||||
|
||||
<p class="v2-desc">
|
||||
A revolutionary national agricultural cooperative uniting millions across the Philippines. We empower farmers, elevate communities, and build a sustainable future through genuine <strong>bayanihan</strong>.
|
||||
</p>
|
||||
|
||||
<div class="v2-actions">
|
||||
<a href="/login" class="v2-btn-primary">Get Started Now</a>
|
||||
<a href="#explore" class="v2-btn-secondary">Explore Programs</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="v2-stats">
|
||||
<div class="v2-stat-card">
|
||||
<div class="v2-stat-val">1M+</div>
|
||||
<div class="v2-stat-label">Active Members</div>
|
||||
</div>
|
||||
<div class="v2-stat-card">
|
||||
<div class="v2-stat-val">81</div>
|
||||
<div class="v2-stat-label">Provinces Reached</div>
|
||||
</div>
|
||||
<div class="v2-stat-card">
|
||||
<div class="v2-stat-val">100%</div>
|
||||
<div class="v2-stat-label">Filipino-Led</div>
|
||||
</div>
|
||||
<div class="v2-stat-card">
|
||||
<div class="v2-stat-val">2022</div>
|
||||
<div class="v2-stat-label">Est. Year</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="explore" class="v2-section" style="background: #fff;">
|
||||
<div class="v2-container">
|
||||
<div class="v2-header">
|
||||
<div class="v2-tag">Impact & Programs</div>
|
||||
<h2 class="v2-h2">Empowering Growth</h2>
|
||||
</div>
|
||||
|
||||
<div class="v2-grid">
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #0038a8;">🌾</div>
|
||||
<h3 class="v2-card-title">Agri-Livelihood</h3>
|
||||
<p class="v2-card-desc">State-of-the-art farm inputs, comprehensive training, and exclusive market access to elevate local agriculture.</p>
|
||||
</div>
|
||||
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #ce1126;">🤝</div>
|
||||
<h3 class="v2-card-title">Bayanihan Network</h3>
|
||||
<p class="v2-card-desc">A highly connected grassroots infrastructure linking members from barangays to provincial hubs seamlessly.</p>
|
||||
</div>
|
||||
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #f59e0b;">💰</div>
|
||||
<h3 class="v2-card-title">Fair Trade Hub</h3>
|
||||
<p class="v2-card-desc">An optimized direct-to-consumer marketplace eliminating middlemen to maximize grower profitability.</p>
|
||||
</div>
|
||||
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #10b981;">📚</div>
|
||||
<h3 class="v2-card-title">Capacity Mastery</h3>
|
||||
<p class="v2-card-desc">Advanced skill acquisition, robust financial literacy, and modern agronomy workshops.</p>
|
||||
</div>
|
||||
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #8b5cf6;">🛡️</div>
|
||||
<h3 class="v2-card-title">Member Protection</h3>
|
||||
<p class="v2-card-desc">Comprehensive cooperative insurance, mutual aid funds, and unwavering advocacy for farmers' rights.</p>
|
||||
</div>
|
||||
|
||||
<div class="v2-card">
|
||||
<div class="v2-icon" style="color: #0ea5e9;">🌏</div>
|
||||
<h3 class="v2-card-title">Global OFW Bridge</h3>
|
||||
<p class="v2-card-desc">Strategic investment channels for overseas Filipinos to fund and grow domestic cooperative ventures.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="v2-container">
|
||||
<div class="v2-cta">
|
||||
<div class="v2-cta-content">
|
||||
<h2 class="v2-cta-title">Ready to Make an Impact?</h2>
|
||||
<p class="v2-cta-desc">Join our million-strong movement. Transform agriculture, secure your livelihood, and uplift the nation with Bigkis and Bisigco.</p>
|
||||
<a href="/login" class="v2-btn-primary" style="background: #fff; color: #0038a8; box-shadow: 0 10px 30px rgba(255,255,255,0.3);">Become a Member</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
HTML;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user