Files
paraguay/index.html
T

383 lines
18 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Paraguay SRL LLC — Community</title>
<meta name="description" content="German / American expats in Paraguay sharing experiences on banking, taxes, legal matters for LLC/SRL." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
--black: #000000;
--white: #ffffff;
--blue: #1e40af;
--gray1: #f3f4f6;
--gray2: #e5e7eb;
}
html { scroll-behavior: smooth; }
body {
font-family: 'Inter', system-ui, sans-serif;
background: var(--white);
color: var(--black);
line-height: 1.6;
}
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 900px; margin: 0 auto; padding: 0 24px; }
.header {
display: flex;
justify-content: center;
align-items: center;
padding: 24px 0;
}
.brand { font-size: 1.75rem; font-weight: 800; }
.lang-select {
display: flex; gap: 8px; background: var(--gray1);
padding: 4px; border-radius: 8px;
}
.lang-btn {
padding: 6px 14px; font-size: .85rem; font-weight: 600;
border: none; border-radius: 6px; background: transparent;
cursor: pointer; color: var(--black); transition: all .2s;
}
.lang-btn.active { background: var(--white); box-shadow: 0 1px 3px rgba(0,0,0,.1); }
.intro { padding: 48px 0 32px; text-align: center; }
.intro h1 { font-size: 2.5rem; font-weight: 800; line-height: 1.2; margin-bottom: 16px; }
.intro p { font-size: 1.1rem; color: #4b5563; max-width: 600px; margin: 0 auto; }
.main-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; }
.news-col h2 { font-size: 1.75rem; font-weight: 800; border-bottom: 2px solid var(--black); padding-bottom: 12px; margin-bottom: 24px; }
.news-item { margin-bottom: 32px; padding-bottom: 24px; border-bottom: 1px solid var(--gray2); }
.news-date { font-size: .75rem; color: #9ca3af; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; }
.news-item h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 10px; line-height: 1.3; }
.news-item p { font-size: 1rem; color: #4b5563; line-height: 1.6; }
.news-tag {
display: inline-block; font-size: .75rem; font-weight: 600;
color: var(--blue); text-transform: uppercase; letter-spacing: .04em;
border: 1px solid var(--blue); padding: 4px 10px; border-radius: 20px; margin-top: 10px;
}
.sidebar-col { position: sticky; top: 20px; height: fit-content; }
.login-panel { background: var(--gray1); padding: 32px; border-radius: 16px; border: 1px solid var(--gray2); }
.login-panel h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid var(--gray2); }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 6px; }
.form-group input {
width: 100%; padding: 12px; border: 1px solid var(--gray2); border-radius: 8px;
font-size: 1rem; outline: none; transition: border-color .2s;
}
.form-group input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(30,64,175,.1); }
.btn-primary { width: 100%; padding: 12px; background: var(--black); color: var(--white); border: none; border-radius: 8px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background .2s; }
.btn-primary:hover { background: var(--blue); }
.btn-secondary { width: 100%; padding: 10px; background: var(--gray1); border: 1px solid var(--gray2); border-radius: 8px; font-size: .9rem; font-weight: 600; cursor: pointer; margin-top: 12px; }
.btn-secondary:hover { background: #e5e7eb; }
.hidden { display: none; }
.success-msg { padding: 12px; background: #d1fae5; border: 1px solid #34d399; border-radius: 8px; color: #065f46; margin-bottom: 16px; text-align: center; }
.footer { margin-top: 64px; padding-top: 32px; border-top: 2px solid var(--black); text-align: center; font-size: 1rem; }
.footer a { font-weight: 600; text-decoration: none; }
.footer a:hover { text-decoration: underline; }
@media (max-width: 768px) {
.main-grid { grid-template-columns: 1fr; }
.sidebar-col { position: static; }
.brand { font-size: 1.4rem; }
.header { flex-direction: column; gap: 12px; }
}
.hide-de { display: none; }
.hide-en { display: none; }
[data-lang="de"] .hide-de { display: block; }
[data-lang="en"] .hide-en { display: block; }
[data-lang="de"] .hide-en { display: none; }
[data-lang="en"] .hide-de { display: none; }
</style>
</head>
<body data-lang="de">
<header class="header">
<div class="brand">Paraguay LLC & SRL Austausch & Community</div>
</header>
<section class="intro">
<h1 class="hide-de">Paraguay LLC & SRL Austausch & Community</h1>
<h1 class="hide-en">Paraguay LLC & SRL Exchange & Community</h1>
<div class="lang-select" style="display: inline-flex; margin-bottom: 16px;">
<button class="lang-btn active" data-lang="de">DE</button>
<button class="lang-btn" data-lang="en">EN</button>
</div>
<p class="hide-de">Willkommen in der Gruppe Paraguay LLC & SRL! Diese Gruppe dient dem Austausch von Menschen, die in Paraguay eine LLC oder SRL betreiben oder sich damit beschäftigen.</p>
<p class="hide-en">Welcome to the Paraguay LLC & SRL group! This group serves as an exchange platform for people who run or are engaged with an LLC or SRL in Paraguay.</p>
</section>
<main class="container" style="padding-top: 32px;">
<div class="main-grid">
<div class="news-col">
<h2 class="hide-de">Über den Channel</h2>
<h2 class="hide-en">About the Channel</h2>
<p class="hide-de">
Willkommen in der Paraguay SRL LLC Community! Wir sind eine engagierte Gruppe von deutschen und amerikanischen Expats, die in Paraguay eine LLC oder SRL betreiben oder sich damit beschäftigen.
</p>
<p class="hide-en">
Welcome to the Paraguay SRL LLC community! We are a dedicated group of German and American expats running or exploring LLC/SRL structures in Paraguay.
</p>
<h3 class="hide-de">Unser Fokus</h3>
<h3 class="hide-en">Our Focus</h3>
<ul class="hide-de">
<li>Banken & Zahlungsverkehr Erfahrungen mit lokalen und internationalen Banken</li>
<li>Rechtliches & Gesellschaftsrecht SRL/LLC Gründung und rechtliche Fragen</li>
<li>Steuern & Buchhaltung Paraguay Territorialsteuersystem explained</li>
</ul>
<ul class="hide-en">
<li>Banking & Payments Experiences with local and international banks</li>
<li>Legal & Corporate Law SRL/LLC formation and legal matters</li>
<li>Taxes & Accounting Paraguay territorial tax system explained</li>
</ul>
<p class="hide-de">
Hier tauschen wir echte Erfahrungen aus von der Gründung über das Banking bis hin zu Steuern und Recht. Gemeinsam lernen wir, was in Paraguay funktioniert.
</p>
<p class="hide-en">
Here we exchange real experiences from formation to banking to taxes and law. Together we learn what actually works in Paraguay.
</p>
<h3 class="hide-de">Was wir nicht wollen</h3>
<h3 class="hide-en">What we do NOT want</h3>
<ul class="hide-de">
<li>Geschäftsanbahnungen / Werbung / Akquise</li>
<li>Vermittlungsangebote innerhalb der Gruppe</li>
</ul>
<ul class="hide-en">
<li>Business solicitations / Advertising / Lead generation</li>
<li>Referral offers within the group</li>
</ul>
<p class="hide-de">
<strong>🚫 Werbung, Akquise und Vermittlungsangebote bitte außerhalb der Gruppe bzw. offline. Der fachliche Erfahrungsaustausch steht im Vordergrund!</strong>
</p>
<p class="hide-en">
<strong>🚫 Advertising, lead generation, and referral offers outside the group or offline. Professional experience exchange is our priority!</strong>
</p>
<p class="hide-de">
Die Website paraguay.odoo4projects.com bietet weiterführende Informationen: Wiki, Teilnehmerliste, Anmeldung für die Gruppe und mehr.
</p>
<p class="hide-en">
The website paraguay.odoo4projects.com offers additional resources: wiki, member list, group registration and more.
</p>
<div style="margin-top: 24px; padding: 20px; background: var(--gray1); border-radius: 12px; text-align: center;">
<p style="font-size: 1.2rem; font-weight: 700; margin-bottom: 12px;">
<span class="hide-de">Melden Sie sich bei unserem Bot im Channel an</span>
<span class="hide-en">Login to our bot in the channel</span>
</p>
<p style="font-size: 1rem; color: #4b5563; margin-bottom: 16px;">
<span class="hide-de">senden Sie /start</span>
<span class="hide-en">send /start</span>
</p>
<a href="https://t.me/paraguaysrcllc_bot" class="btn-primary" style="display: inline-block; background: #2AABEE;">
<span class="hide-de">Telegram beitreten</span>
<span class="hide-en">Join Telegram</span>
</a>
</div>
</div>
<aside class="sidebar-col">
<div class="login-panel">
<h3 class="hide-de">Anmeldung</h3>
<h3 class="hide-en">Login</h3>
<form id="login-form">
<div id="login-step-1">
<div class="form-group">
<label for="telegram-user" class="hide-de">Telegram Nutzername</label>
<label for="telegram-user" class="hide-en">Telegram Username</label>
<input type="text" id="telegram-user" required placeholder="@username" />
</div>
<button type="button" class="btn-primary hide-de" onclick="sendTelegramUser()">Anmelden</button>
<button type="button" class="btn-primary hide-en" onclick="sendTelegramUser()">Login</button>
<p class="hide-de" style="font-size: .85rem; color: #6b7280; margin-top: 12px;">Wir senden einen Code an Ihren Telegram-Account.</p>
<p class="hide-en" style="font-size: .85rem; color: #6b7280; margin-top: 12px;">We'll send a code to your Telegram account.</p>
</div>
<div id="login-step-2" class="hidden">
<div class="form-group">
<label for="verification-code" class="hide-de">Verifizierungscode</label>
<label for="verification-code" class="hide-en">Verification code</label>
<input type="text" id="verification-code" required placeholder="123456" />
</div>
<button type="button" class="btn-primary hide-de" onclick="verifyCode()">Anmelden</button>
<button type="button" class="btn-primary hide-en" onclick="verifyCode()">Login</button>
</div>
<div id="login-step-3" class="hidden">
<div class="form-group">
<label for="full-name" class="hide-de">Vollständiger Name</label>
<label for="full-name" class="hide-en">Full name</label>
<input type="text" id="full-name" required placeholder="Max Mustermann" />
</div>
<div class="form-group">
<label for="llc-name" class="hide-de">Name der LLC / SRL</label>
<label for="llc-name" class="hide-en">LLC / SRL name</label>
<input type="text" id="llc-name" required placeholder="Paraguay LLC" />
</div>
<button type="button" class="btn-primary hide-de" onclick="submitLoginData()">Anmelden</button>
<button type="button" class="btn-primary hide-en" onclick="submitLoginData()">Login</button>
</div>
</form>
<button type="button" class="btn-secondary hide-de" onclick="showRegisterForm()">Registrieren</button>
<button type="button" class="btn-secondary hide-en" onclick="showRegisterForm()">Register</button>
</div>
</aside>
</div>
</main>
<footer class="footer">
<p>
<span class="hide-de">Sponsored by</span>
<span class="hide-en">Sponsored by</span>
<a href="https://ODOO4projects.com" target="_blank" rel="noopener">ODOO4projects</a>
</p>
</footer>
<script>
document.querySelectorAll('.lang-btn').forEach(btn => {
btn.addEventListener('click', () => {
const lang = btn.dataset.lang;
document.body.dataset.lang = lang;
document.querySelectorAll('.lang-btn').forEach(b => b.classList.remove('active'));
btn.classList.add('active');
});
});
const API_URL = 'https://n8n.odoo4projects.com/webhook/paraguay/login';
async function sendTelegramUser() {
const user = document.getElementById('telegram-user').value.trim();
if (!user) { alert('Bitte geben Sie einen Telegram-Nutzernamen ein.'); return; }
const btn = document.querySelector('#login-step-1 .btn-primary');
btn.disabled = true; btn.textContent = 'Verifizierung läuft...';
try {
const response = await fetch(API_URL, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ username: user })
});
if (response.ok) {
document.getElementById('login-step-1').classList.add('hidden');
document.getElementById('login-step-2').classList.remove('hidden');
alert('Code wurde an Ihren Telegram-Account gesendet.');
} else {
alert('Fehler bei der Verifizierung. Bitte versuchen Sie es erneut.');
btn.disabled = false; btn.textContent = document.body.dataset.lang === 'de' ? 'Anmelden' : 'Login';
}
} catch (error) {
console.error(error);
alert('Fehler bei der Verbindung. Bitte versuchen Sie es erneut.');
btn.disabled = false; btn.textContent = document.body.dataset.lang === 'de' ? 'Anmelden' : 'Login';
}
}
async function verifyCode() {
const code = document.getElementById('verification-code').value.trim();
if (!code) { alert('Bitte geben Sie den Verifizierungscode ein.'); return; }
const btns = document.querySelectorAll('#login-step-2 .btn-primary');
btns.forEach(b => b.disabled = true);
try {
const response = await fetch(API_URL, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ username: document.getElementById('telegram-user').value, code: code })
});
if (response.ok) {
document.getElementById('login-step-2').classList.add('hidden');
document.getElementById('login-step-3').classList.remove('hidden');
} else {
alert('Ungültiger Code. Bitte versuchen Sie es erneut.');
btns.forEach(b => b.disabled = false);
}
} catch (error) {
console.error(error);
alert('Fehler bei der Verbindung. Bitte versuchen Sie es erneut.');
btns.forEach(b => b.disabled = false);
}
}
function showRegisterForm() {
document.getElementById('login-step-1').classList.add('hidden');
document.getElementById('login-step-2').classList.add('hidden');
document.getElementById('register-form').classList.remove('hidden');
}
async function submitLoginData() {
const name = document.getElementById('full-name').value.trim();
const llc = document.getElementById('llc-name').value.trim();
if (!name || !llc) { alert('Bitte geben Sie Name und LLC-Namen ein.'); return; }
const btns = document.querySelectorAll('#login-step-3 .btn-primary');
btns.forEach(b => b.disabled = true);
try {
const response = await fetch(API_URL, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
username: document.getElementById('telegram-user').value,
name: name,
llc: llc
})
});
if (response.ok) {
document.getElementById('login-step-3').classList.add('hidden');
document.getElementById('success-message').classList.remove('hidden');
setTimeout(() => { window.location.href = 'https://paraguay.odoo4projects.com'; }, 1500);
} else {
alert('Fehler bei der Anmeldung.');
btns.forEach(b => b.disabled = false);
}
} catch (error) {
console.error(error);
alert('Fehler bei der Verbindung.');
btns.forEach(b => b.disabled = false);
}
}
async function submitRegisterData() {
const user = document.getElementById('register-telegram-user').value.trim();
const name = document.getElementById('register-full-name').value.trim();
const llc = document.getElementById('register-llc-name').value.trim();
if (!user || !name || !llc) { alert('Bitte füllen Sie alle Felder aus.'); return; }
const btns = document.querySelectorAll('#register-form .btn-primary');
btns.forEach(b => b.disabled = true);
try {
const response = await fetch(API_URL, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ username: user, name: name, llc: llc })
});
if (response.ok) {
document.getElementById('register-form').classList.add('hidden');
document.getElementById('success-message').classList.remove('hidden');
setTimeout(() => { window.location.href = 'https://paraguay.odoo4projects.com'; }, 1500);
} else {
alert('Fehler bei der Registrierung.');
btns.forEach(b => b.disabled = false);
}
} catch (error) {
console.error(error);
alert('Fehler bei der Verbindung.');
btns.forEach(b => b.disabled = false);
}
}
</script>
</body>
</html>