<!doctype html>
<html lang="pl">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>PB Secure</title>
<meta name="description" content="PB Secure — strona w budowie." />
<style>
:root { color-scheme: light dark; }
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
line-height: 1.4;
display: grid;
min-height: 100vh;
place-items: center;
background: radial-gradient(1200px 600px at 20% 10%, rgba(0,120,255,.18), transparent 60%),
radial-gradient(900px 500px at 80% 90%, rgba(120,60,255,.16), transparent 60%),
#0b0f19;
color: #e8eefc;
}
.card {
width: min(760px, calc(100% - 40px));
border: 1px solid rgba(255,255,255,.12);
border-radius: 18px;
padding: 28px;
background: rgba(255,255,255,.06);
backdrop-filter: blur(8px);
box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
h1 { margin: 0 0 8px; font-size: 28px; letter-spacing: .2px; }
p { margin: 0 0 14px; opacity: .92; }
.row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
a.btn {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 10px 14px;
border-radius: 12px;
text-decoration: none;
border: 1px solid rgba(255,255,255,.18);
background: rgba(255,255,255,.08);
color: inherit;
}
a.btn:hover { background: rgba(255,255,255,.14); }
.small { font-size: 12px; opacity: .7; margin-top: 16px; }
code { opacity: .9; }
</style>
</head>
<body>
<main class="card">
<h1>PB Secure</h1>
<p>Strona w budowie. Jeśli to widzisz, hosting na Cloudflare Pages działa poprawnie.</p>
<div class="row">
<a class="btn" href="mailto:kontakt@pbsecure.cloud">Kontakt</a>
<a class="btn" href="#" onclick="alert('Dodamy tu formularz / panel w kolejnym kroku.'); return false;">Zgłoś zapytanie</a>
</div>
<p class="small">
Wersja testowa: <code>index.html</code> (statyczna). Następny krok: podpięcie domeny <code>pbsecure.cloud</code>.
</p>
</main>
</body>
</html>