<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BRAVE UnAIted – Hero</title>
<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=Archivo:wght@400;600;700;800;900&family=Manrope:wght@400;500;600;700&family=Comic+Neue:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
<section id="brave-unAIted-hero">
<style>
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;600;700;800;900&family=Manrope:wght@400;500;600;700&family=Comic+Neue:wght@400;700&display=swap');
#brave-unAIted-hero {
background-color: #6ABFFF;
min-height: 920px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding-block: 0;
padding-inline: 0;
box-sizing: border-box;
overflow: hidden;
position: relative;
}
#brave-unAIted-hero .inner {
width: 100%;
max-width: 1440px;
display: flex;
flex-direction: column;
align-items: center;
gap: 48px;
z-index: 2;
}
@media (min-width: 1024px) {
#brave-unAIted-hero .inner {
flex-direction: row;
align-items: stretch;
gap: 64px;
min-height: 920px;
}
}
/* LEFT COLUMN */
#brave-unAIted-hero .col-text {
flex: 1.1;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
padding: 48px var(--et-spacing-horizontal, 24px) 48px 44px;
box-sizing: border-box;
}
@media (max-width: 1023px) {
#brave-unAIted-hero .col-text {
padding: 48px 24px;
}
}
#brave-unAIted-hero .label-date {
display: flex;
height: 56px;
flex-direction: column;
justify-content: center;
color: #000;
font-family: 'Archivo', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 16.5px;
letter-spacing: 3.3px;
text-transform: uppercase;
margin-bottom: 8px;
}
@media (min-width: 640px) {
#brave-unAIted-hero .label-date {
font-size: 20px;
}
}
#brave-unAIted-hero h1 {
margin: 0;
display: flex;
flex-direction: column;
}
/* outside stroke zasymulowany przez text-shadow rozchodzący się we wszystkich kierunkach */
#brave-unAIted-hero .headline-white {
color: #FFF;
font-family: 'Archivo', sans-serif;
font-size: clamp(56px, 8vw, 120px);
font-weight: 700;
line-height: 112px;
letter-spacing: -2.6px;
margin-bottom: -4px;
text-shadow:
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000,
-2px 0px 0 #000,
2px 0px 0 #000,
0px -2px 0 #000,
0px 2px 0 #000;
}
/* inside stroke przy użyciu standardowego -webkit-text-stroke-width */
#brave-unAIted-hero .headline-comic {
color: #FECC00;
-webkit-text-stroke-width: 3px;
-webkit-text-stroke-color: #BA3340;
text-shadow: -4px 4px 0 #FFF;
font-family: 'Comic Neue', 'Comic Sans MS', 'Comic Sans', cursive, sans-serif;
font-size: clamp(56px, 8vw, 120px);
font-weight: 700;
line-height: 112px;
letter-spacing: -2.6px;
margin-top: 0;
margin-bottom: 0;
}
/* outside stroke zasymulowany przez text-shadow rozchodzący się we wszystkich kierunkach */
#brave-unAIted-hero .headline-forgood {
color: #FFF;
font-family: 'Archivo', sans-serif;
font-size: clamp(56px, 8vw, 120px);
font-weight: 700;
line-height: 112px;
letter-spacing: -2.6px;
margin-top: 4px;
margin-bottom: 40px;
text-shadow:
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000,
-2px 0px 0 #000,
2px 0px 0 #000,
0px -2px 0 #000,
0px 2px 0 #000;
}
/* SPECJALNA NADPISKA ODSTĘPÓW (MARGINESÓW & HEIGHTS) DLA MOBILE - ZMNIEJSZENIE DO 0 */
@media (max-width: 767px) {
#brave-unAIted-hero h1 {
gap: 0px !important;
}
#brave-unAIted-hero .headline-white {
line-height: 48px !important;
margin-bottom: 0px !important;
font-size: 52px !important;
}
#brave-unAIted-hero .headline-comic {
line-height: 52px !important;
margin-top: 0px !important;
margin-bottom: 8px !important; /* Zwiększono z 0px do 8px dla lekkiego odstępu po 'buduje z AI' na mobile */
font-size: 52px !important;
text-shadow: -2px 2px 0 #FFF !important;
-webkit-text-stroke-width: 1.5px !important;
}
#brave-unAIted-hero .headline-forgood {
line-height: 48px !important;
margin-top: 0px !important;
margin-bottom: 24px !important;
font-size: 52px !important;
}
}
#brave-unAIted-hero .description {
color: #000;
font-family: 'Manrope', sans-serif;
font-size: 18px;
font-weight: 400;
line-height: 26px;
max-width: 534px;
margin-bottom: 24px;
}
@media (min-width: 640px) {
#brave-unAIted-hero .description {
font-size: 20px;
}
}
#brave-unAIted-hero .btn-group {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-bottom: 48px;
}
#brave-unAIted-hero .btn-hero {
display: inline-flex;
padding: 16px 24px;
justify-content: center;
align-items: center;
gap: 12px;
border: 2px solid #000;
background: #FFD723;
color: #000;
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
font-weight: 600;
line-height: 1.2;
text-decoration: none;
border-radius: 0px;
cursor: pointer;
transition: background-color 0.2s ease, transform 0.1s ease;
white-space: nowrap;
text-transform: uppercase;
}
#brave-unAIted-hero .btn-hero:hover {
background-color: #f5c200;
}
#brave-unAIted-hero .btn-hero:focus-visible {
outline: 2px solid #000;
outline-offset: 3px;
}
#brave-unAIted-hero .btn-hero:active {
transform: scale(0.98);
}
#brave-unAIted-hero .big-date {
color: #BA3340;
paint-order: stroke fill;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: #FFF;
font-family: 'Archivo', sans-serif;
font-size: clamp(48px, 7vw, 96px);
font-weight: 900;
line-height: 1;
letter-spacing: -2px;
text-align: left;
margin-bottom: 0;
}
@media (min-width: 1024px) {
#brave-unAIted-hero .big-date {
-webkit-text-stroke-width: 3px;
font-size: clamp(72px, 6vw, 120px);
line-height: 1.1;
}
}
/* RIGHT COLUMN */
#brave-unAIted-hero .col-image {
flex: 0.9;
display: flex;
align-items: stretch;
justify-content: flex-end;
position: relative;
}
#brave-unAIted-hero .hero-img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
/* NAKLEJKA */
#brave-unAIted-hero .sticker {
position: absolute;
bottom: 24px;
right: 24px;
width: clamp(260px, 30vw, 420px);
height: auto;
z-index: 10;
pointer-events: none;
transform: rotate(-3deg);
filter: drop-shadow(0px 8px 24px rgba(0,0,0,0.2));
animation: gentle-wobble 6s ease-in-out infinite alternate;
}
@keyframes gentle-wobble {
0% { transform: rotate(-3deg) translateY(0); }
100% { transform: rotate(-1deg) translateY(-6px); }
}
@media (min-width: 1024px) {
#brave-unAIted-hero .col-image {
margin-right: 0;
align-self: stretch;
}
#brave-unAIted-hero .inner {
max-width: 100%;
padding-left: calc((100vw - 1440px) / 2);
}
}
@media (max-width: 1023px) {
#brave-unAIted-hero .col-image {
width: 100%;
height: 500px;
}
#brave-unAIted-hero .inner {
gap: 0px;
}
#brave-unAIted-hero .sticker {
bottom: 16px;
right: 16px;
width: 200px;
}
}
@media (max-width: 1440px) and (min-width: 1024px) {
#brave-unAIted-hero .inner {
padding-left: 44px;
}
}
</style>
<div class="inner">
<!-- LEFT: Text Column -->
<div class="col-text">
<p class="label-date">28.08.2026 | udział bezpłatny</p>
<h1>
<span class="headline-white">Cała Polska</span>
<span class="headline-comic">buduje z AI</span>
<span class="headline-forgood">for good</span>
</h1>
<p class="description">
Dołącz do bezpłatnego hackathonu BRAVE UnAIted.<br>
Przekonaj się, ile można zbudować z AI w jeden dzień.
</p>
<div class="btn-group">
<a
class="btn-hero"
href="https://luma.com/unaited"
data-unaited-stepper-register
data-unaited-source="unaited-hero"
aria-haspopup="dialog"
aria-controls="unaited-stepper-modal"
>
Zapisz się na hackathon za free
</a>
</div>
<p class="big-date" aria-label="Data wydarzenia: 28 sierpnia 2026">28.08.2026</p>
</div>
<!-- RIGHT: Image Column -->
<div class="col-image">
<img
class="hero-img"
src="https://app.easy.tools/files/pages/assets/2026-07-24/grafika-hero-unaited_mrz7oo19.webp"
alt="Brave UnAIted – Retro kolaż z uczestnikami wydarzenia i motywem starych komputerów oraz dyskietki"
loading="eager"
>
</div>
</div>
<!-- NAKLEJKA / STICKER -->
<img
class="sticker"
src="https://app.easy.tools/files/pages/assets/2026-07-24/frame-1410125371_mrz7osw7.webp"
alt="Brave Troska Za Starzy na Techno"
loading="eager"
>
</section>
<!--
Własny popup rejestracyjny jest osadzony tylko raz, razem z sekcją hero.
Pozostałe CTA na stronie otwierają go przez data-unaited-stepper-register.
Link href każdego CTA pozostaje awaryjną ścieżką do Luma, gdy JavaScript nie zadziała.
-->
<style id="unaited-stepper-styles">
body.unaited-modal-lock {
overflow: hidden;
}
#unaited-stepper-modal,
#unaited-stepper-modal *,
#unaited-terms-modal,
#unaited-terms-modal * {
box-sizing: border-box;
}
#unaited-stepper-modal,
#unaited-terms-modal {
--unaited-blue: #6abfff;
--unaited-yellow: #ffd723;
--unaited-red: #ba3340;
--unaited-red-dark: #ad1724;
--unaited-purple: #4c1fa3;
--unaited-paper: #f9fafb;
--unaited-black: #000000;
position: fixed;
inset: 0;
z-index: 2147483000;
display: none;
place-items: center;
padding: 12px;
font-family: 'Manrope', sans-serif;
}
#unaited-stepper-modal.is-open {
display: grid;
}
#unaited-stepper-modal .modal-backdrop {
position: absolute;
inset: 0;
background: rgba(11, 13, 19, 0.8);
backdrop-filter: blur(7px);
-webkit-backdrop-filter: blur(7px);
}
#unaited-stepper-modal .modal-dialog {
position: relative;
width: min(760px, calc(100vw - 24px));
max-height: calc(100dvh - 24px);
overflow: auto;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-blue);
box-shadow: 10px 10px 0 var(--unaited-red-dark);
overscroll-behavior: contain;
}
#unaited-stepper-modal .modal-header {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 18px;
align-items: center;
padding: 18px 22px;
border-bottom: 3px solid var(--unaited-black);
background: var(--unaited-yellow);
}
#unaited-stepper-modal .modal-kicker {
margin: 0 0 4px;
color: var(--unaited-black);
font: 800 11px/1.2 'Archivo', sans-serif;
letter-spacing: 0.08em;
text-transform: uppercase;
}
#unaited-stepper-modal .modal-title {
margin: 0;
color: var(--unaited-red);
font: 900 clamp(25px, 4vw, 42px)/0.98 'Archivo', sans-serif;
letter-spacing: -0.035em;
text-transform: uppercase;
}
#unaited-stepper-modal .modal-close {
width: 46px;
height: 46px;
padding: 0;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-red);
color: #ffffff;
font: 700 29px/1 'Archivo', sans-serif;
cursor: pointer;
}
#unaited-stepper-modal .stepper-form {
padding: 20px 22px 22px;
}
#unaited-stepper-modal .progress-meta {
display: flex;
justify-content: space-between;
gap: 16px;
margin-bottom: 8px;
color: var(--unaited-black);
font: 800 12px/1.2 'Archivo', sans-serif;
text-transform: uppercase;
}
#unaited-stepper-modal .progress-track {
height: 14px;
margin-bottom: 18px;
overflow: hidden;
border: 2px solid var(--unaited-black);
background: #ffffff;
}
#unaited-stepper-modal .progress-bar {
width: 10%;
height: 100%;
background: var(--unaited-red);
transition: width 180ms ease;
}
#unaited-stepper-modal .step-card {
display: flex;
height: 350px;
min-height: 350px;
min-inline-size: 0;
flex-direction: column;
justify-content: center;
margin: 0;
padding: clamp(22px, 4vw, 38px);
overflow-y: hidden;
border: 3px solid var(--unaited-black);
background: var(--unaited-paper);
}
#unaited-stepper-modal .step-card[hidden],
#unaited-stepper-modal .success-screen[hidden],
#unaited-stepper-modal .progress-meta[hidden],
#unaited-stepper-modal .progress-track[hidden],
#unaited-stepper-modal .stepper-footer[hidden] {
display: none !important;
}
#unaited-stepper-modal .step-eyebrow {
margin: 0 0 10px;
color: var(--unaited-red);
font: 800 12px/1.25 'Archivo', sans-serif;
letter-spacing: 0.08em;
text-transform: uppercase;
}
#unaited-stepper-modal .step-question {
display: block;
max-width: 650px;
margin: 0 0 22px;
padding: 0;
color: var(--unaited-black);
font: 800 clamp(23px, 4vw, 35px)/1.08 'Archivo', sans-serif;
letter-spacing: -0.025em;
}
#unaited-stepper-modal .step-hint {
margin: -12px 0 20px;
color: #4b5563;
font-size: 13px;
font-weight: 600;
}
#unaited-stepper-modal .name-fields {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
#unaited-stepper-modal .field-group {
min-width: 0;
}
#unaited-stepper-modal .field-label {
display: block;
margin-bottom: 7px;
color: var(--unaited-red);
font: 800 12px/1.25 'Archivo', sans-serif;
letter-spacing: 0.06em;
text-transform: uppercase;
}
#unaited-stepper-modal .text-control {
width: 100%;
min-height: 58px;
padding: 13px 15px;
border: 3px solid var(--unaited-black);
border-radius: 0;
outline: none;
background: #ffffff;
color: var(--unaited-black);
font: 700 17px/1.25 'Manrope', sans-serif;
}
#unaited-stepper-modal .text-control:focus,
#unaited-stepper-modal .modal-close:focus-visible,
#unaited-stepper-modal .nav-button:focus-visible,
#unaited-stepper-modal .fallback-link:focus-visible,
#unaited-stepper-modal .terms-open:focus-visible,
#unaited-stepper-modal .terms-close:focus-visible,
#unaited-stepper-modal .terms-accept:focus-visible {
outline: none;
box-shadow: 5px 5px 0 var(--unaited-purple);
}
#unaited-stepper-modal .option-list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
}
#unaited-stepper-modal .option-label {
position: relative;
display: block;
min-width: 0;
cursor: pointer;
}
#unaited-stepper-modal .option-label input {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
#unaited-stepper-modal .option-copy {
display: flex;
min-height: 56px;
align-items: center;
padding: 11px 13px;
border: 2px solid var(--unaited-black);
background: #ffffff;
color: var(--unaited-black);
font-size: 13px;
font-weight: 700;
line-height: 1.3;
}
#unaited-stepper-modal .option-label:hover .option-copy {
background: #fff4b8;
}
#unaited-stepper-modal .option-label input:checked + .option-copy {
background: var(--unaited-yellow);
box-shadow: 4px 4px 0 var(--unaited-red);
}
#unaited-stepper-modal .option-label input:focus-visible + .option-copy {
box-shadow: 4px 4px 0 var(--unaited-purple);
}
#unaited-stepper-modal .consent-card {
display: grid;
grid-template-columns: 24px minmax(0, 1fr);
gap: 12px;
align-items: start;
padding: 16px;
border: 3px solid var(--unaited-black);
background: #ffffff;
color: var(--unaited-black);
font-size: 14px;
font-weight: 650;
line-height: 1.45;
}
#unaited-stepper-modal .consent-card input {
width: 22px;
height: 22px;
margin: 0;
accent-color: var(--unaited-red);
}
#unaited-stepper-modal .consent-card a,
#unaited-stepper-modal .terms-open {
color: var(--unaited-purple);
font-weight: 800;
text-underline-offset: 2px;
}
#unaited-stepper-modal .consent-card label {
cursor: pointer;
}
#unaited-stepper-modal .terms-open {
display: inline;
margin: 0;
padding: 0;
border: 0;
background: transparent;
font: inherit;
text-decoration: underline;
cursor: pointer;
}
#unaited-stepper-modal .success-screen {
display: flex;
height: 350px;
min-height: 350px;
flex-direction: column;
align-items: center;
justify-content: center;
padding: clamp(30px, 6vw, 64px);
border: 3px solid var(--unaited-black);
background: var(--unaited-paper);
color: var(--unaited-black);
text-align: center;
}
#unaited-stepper-modal .success-eyebrow {
margin: 0 0 14px;
color: var(--unaited-red);
font: 800 13px/1.2 'Archivo', sans-serif;
letter-spacing: 0.1em;
text-transform: uppercase;
}
#unaited-stepper-modal .success-title {
margin: 0;
color: var(--unaited-red);
font: 900 clamp(46px, 8vw, 74px)/0.95 'Archivo', sans-serif;
letter-spacing: -0.045em;
text-transform: uppercase;
}
#unaited-stepper-modal .success-title:focus {
outline: none;
}
#unaited-stepper-modal .success-copy {
max-width: 520px;
margin: 18px 0 26px;
font-size: 17px;
font-weight: 700;
line-height: 1.45;
}
#unaited-terms-modal {
position: absolute;
inset: 0;
z-index: 5;
display: none;
place-items: center;
padding: 20px;
background: rgba(11, 13, 19, 0.8);
backdrop-filter: blur(7px);
-webkit-backdrop-filter: blur(7px);
}
#unaited-terms-modal.is-open {
display: grid;
}
#unaited-terms-modal .terms-backdrop {
position: absolute;
inset: 0;
}
#unaited-terms-modal .terms-dialog {
position: relative;
width: min(620px, calc(100vw - 40px));
max-height: calc(100dvh - 40px);
overflow-y: auto;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-blue);
color: var(--unaited-black);
box-shadow: 10px 10px 0 var(--unaited-red-dark);
font-family: 'Manrope', sans-serif;
overscroll-behavior: contain;
}
#unaited-terms-modal .terms-dialog:focus {
outline: none;
}
#unaited-terms-modal .terms-header {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 18px;
align-items: center;
padding: 16px 18px;
border-bottom: 3px solid var(--unaited-black);
background: var(--unaited-yellow);
}
#unaited-terms-modal .terms-heading {
display: flex;
min-width: 0;
align-items: center;
gap: 12px;
}
#unaited-terms-modal .terms-icon {
display: grid;
width: 44px;
height: 44px;
flex: 0 0 auto;
place-items: center;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-paper);
color: var(--unaited-red);
}
#unaited-terms-modal .terms-icon svg {
width: 25px;
height: 25px;
}
#unaited-terms-modal .terms-close {
display: grid;
width: 46px;
height: 46px;
place-items: center;
padding: 0;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-red);
color: #ffffff;
cursor: pointer;
}
#unaited-terms-modal .terms-close svg {
width: 20px;
height: 20px;
}
#unaited-terms-modal .terms-title {
margin: 0;
color: var(--unaited-red);
font: 900 clamp(22px, 4vw, 31px)/1 'Archivo', sans-serif;
letter-spacing: -0.025em;
text-transform: uppercase;
}
#unaited-terms-modal .terms-body {
padding: 18px;
}
#unaited-terms-modal .terms-content {
padding: 20px;
border: 3px solid var(--unaited-black);
background: var(--unaited-paper);
}
#unaited-terms-modal .terms-copy {
margin: 0;
color: var(--unaited-black);
font-size: 14px;
font-weight: 600;
line-height: 1.5;
}
#unaited-terms-modal .terms-note {
margin: 16px 0 0;
padding-top: 14px;
border-top: 2px solid var(--unaited-black);
color: #4b5563;
font-size: 12px;
font-weight: 600;
line-height: 1.45;
}
#unaited-terms-modal .terms-accept {
width: 100%;
min-height: 48px;
margin-top: 14px;
padding: 12px 18px;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: var(--unaited-yellow);
color: var(--unaited-black);
font: 800 14px/1.15 Arial, Helvetica, sans-serif;
text-transform: uppercase;
cursor: pointer;
}
#unaited-terms-modal .terms-close:focus-visible,
#unaited-terms-modal .terms-accept:focus-visible {
outline: none;
box-shadow: 5px 5px 0 var(--unaited-purple);
}
#unaited-stepper-modal .stepper-footer {
display: grid;
grid-template-columns: auto minmax(0, 1fr) auto;
gap: 12px;
align-items: center;
margin-top: 16px;
}
#unaited-stepper-modal .form-feedback {
display: grid;
gap: 4px;
justify-items: center;
min-width: 0;
}
#unaited-stepper-modal .form-status {
min-height: 20px;
margin: 0;
font-size: 12px;
font-weight: 700;
line-height: 1.35;
text-align: center;
}
#unaited-stepper-modal .form-status.is-error {
color: #7f1d1d;
}
#unaited-stepper-modal .form-status.is-success {
color: #14532d;
}
#unaited-stepper-modal .fallback-link {
color: #4c1fa3;
font: 800 12px/1.35 'Archivo', sans-serif;
text-align: center;
text-underline-offset: 2px;
}
#unaited-stepper-modal .nav-button {
min-height: 48px;
padding: 11px 19px;
border: 3px solid var(--unaited-black);
border-radius: 0;
background: #ffffff;
color: var(--unaited-black);
font: 800 14px/1.15 Arial, Helvetica, sans-serif;
text-transform: uppercase;
cursor: pointer;
}
#unaited-stepper-modal .nav-button-primary {
background: var(--unaited-yellow);
}
#unaited-stepper-modal .nav-button.success-close {
min-width: 190px;
background: var(--unaited-yellow);
}
#unaited-stepper-modal .nav-button-submit {
background: var(--unaited-red);
color: #ffffff;
}
#unaited-stepper-modal .nav-button:disabled {
cursor: not-allowed;
opacity: 0.45;
}
#unaited-stepper-modal .unaited-honeypot {
position: absolute !important;
left: -10000px !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
@media (max-width: 640px) {
#unaited-stepper-modal {
padding: 0;
}
#unaited-stepper-modal .modal-dialog {
width: 100%;
min-height: 100dvh;
max-height: 100dvh;
border: 0;
box-shadow: none;
}
#unaited-stepper-modal .modal-header {
position: sticky;
top: 0;
z-index: 2;
padding: 14px 16px;
}
#unaited-stepper-modal .stepper-form {
padding: 16px;
}
#unaited-stepper-modal .step-card {
height: 430px;
min-height: 430px;
max-height: 430px;
overflow-y: auto;
padding: 22px 18px;
}
#unaited-stepper-modal .name-fields {
grid-template-columns: 1fr;
}
#unaited-stepper-modal .option-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
#unaited-stepper-modal .option-copy {
min-height: 64px;
padding: 10px;
font-size: 12px;
}
#unaited-stepper-modal .success-screen {
height: 430px;
min-height: 430px;
padding: 30px 22px;
}
#unaited-stepper-modal .success-title {
font-size: clamp(42px, 15vw, 60px);
}
#unaited-terms-modal {
padding: 0;
}
#unaited-terms-modal .terms-dialog {
width: 100%;
max-height: 100dvh;
border: 0;
box-shadow: none;
}
#unaited-terms-modal .terms-header {
position: sticky;
top: 0;
z-index: 1;
padding: 14px 16px;
}
#unaited-terms-modal .terms-heading {
gap: 9px;
}
#unaited-terms-modal .terms-icon {
width: 40px;
height: 40px;
}
#unaited-terms-modal .terms-title {
font-size: clamp(19px, 6.2vw, 25px);
}
#unaited-terms-modal .terms-body {
padding: 16px;
}
#unaited-terms-modal .terms-content {
padding: 17px;
}
#unaited-stepper-modal .stepper-footer {
grid-template-columns: 1fr 1fr;
}
#unaited-stepper-modal .form-feedback {
grid-column: 1 / -1;
grid-row: 1;
}
}
@media (prefers-reduced-motion: no-preference) {
#unaited-stepper-modal.is-open .modal-dialog {
animation: unaited-modal-enter 160ms ease-out;
}
#unaited-stepper-modal .step-card:not([hidden]) {
animation: unaited-step-enter 150ms ease-out;
}
@keyframes unaited-modal-enter {
from { opacity: 0; transform: translateY(12px) scale(0.985); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes unaited-step-enter {
from { opacity: 0; transform: translateX(10px); }
to { opacity: 1; transform: translateX(0); }
}
}
</style>
<div id="unaited-stepper-modal" aria-hidden="true">
<div class="modal-backdrop" data-stepper-close></div>
<section
class="modal-dialog"
role="dialog"
aria-modal="true"
aria-labelledby="stepper-modal-title"
aria-describedby="stepper-modal-description"
>
<header class="modal-header">
<div>
<p id="stepper-modal-description" class="modal-kicker">28 sierpnia 2026 · online · bezpłatnie</p>
<h2 id="stepper-modal-title" class="modal-title">Dołącz do hackathonu</h2>
</div>
<button class="modal-close" type="button" aria-label="Zamknij formularz" data-stepper-close>×</button>
</header>
<form id="unaited-stepper-form" class="stepper-form" novalidate>
<input type="hidden" name="event_id" value="evt-6kxQIOXAvuOAfxB">
<input type="hidden" name="ticket_type_id" value="ttype-TNyEkB16m91OTC2">
<div class="unaited-honeypot" aria-hidden="true">
<label for="stepper-website">Nie wypełniaj tego pola</label>
<input id="stepper-website" name="website" type="text" tabindex="-1" autocomplete="off">
</div>
<div id="stepper-progress-meta" class="progress-meta" aria-live="polite">
<span id="stepper-progress-label">Krok 1 z 10</span>
<span id="stepper-progress-percent">10%</span>
</div>
<div
id="stepper-progress-track"
class="progress-track"
role="progressbar"
aria-label="Postęp formularza"
aria-valuemin="1"
aria-valuemax="10"
aria-valuenow="1"
>
<div id="stepper-progress-bar" class="progress-bar"></div>
</div>
<div class="step-card" data-step>
<p class="step-eyebrow">Poznajmy się</p>
<p id="stepper-name-question" class="step-question">Jak masz na imię i nazwisko? *</p>
<div class="name-fields" role="group" aria-labelledby="stepper-name-question">
<div class="field-group">
<label class="field-label" for="stepper-first-name">Imię *</label>
<input class="text-control" id="stepper-first-name" name="first_name" type="text" autocomplete="given-name" placeholder="Jan" required>
</div>
<div class="field-group">
<label class="field-label" for="stepper-last-name">Nazwisko *</label>
<input class="text-control" id="stepper-last-name" name="last_name" type="text" autocomplete="family-name" placeholder="Kowalski" required>
</div>
</div>
</div>
<div class="step-card" data-step hidden>
<p class="step-eyebrow">Kontakt</p>
<label class="step-question" for="stepper-email">Jaki jest Twój adres e-mail? *</label>
<input class="text-control" id="stepper-email" name="email" type="email" autocomplete="email" placeholder="jan@firma.pl" required>
</div>
<div class="step-card" data-step hidden>
<p class="step-eyebrow">Kontakt · opcjonalne</p>
<label class="step-question" for="stepper-phone">Jaki jest Twój numer telefonu?</label>
<p class="step-hint">Możesz pominąć ten krok.</p>
<input class="text-control" id="stepper-phone" name="phone" type="tel" autocomplete="tel" placeholder="+48 512 345 678">
</div>
<div class="step-card" data-step hidden>
<p class="step-eyebrow">Profil · opcjonalne</p>
<label class="step-question" for="stepper-linkedin">Podaj adres swojego profilu LinkedIn</label>
<p class="step-hint">Możesz pominąć ten krok.</p>
<input class="text-control" id="stepper-linkedin" name="linkedin" type="url" inputmode="url" placeholder="https://linkedin.com/in/...">
</div>
<div
class="step-card"
data-step
data-auto-advance
role="group"
aria-labelledby="stepper-occupation-question"
hidden
>
<p class="step-eyebrow">Twoja specjalizacja</p>
<p id="stepper-occupation-question" class="step-question">Czym zajmujesz się na co dzień? *</p>
<div class="option-list">
<label class="option-label"><input type="radio" name="occupation" value="Development" required><span class="option-copy">Development</span></label>
<label class="option-label"><input type="radio" name="occupation" value="Management" required><span class="option-copy">Management</span></label>
<label class="option-label"><input type="radio" name="occupation" value="Sprzedaż" required><span class="option-copy">Sprzedaż</span></label>
<label class="option-label"><input type="radio" name="occupation" value="Marketing" required><span class="option-copy">Marketing</span></label>
<label class="option-label"><input type="radio" name="occupation" value="Produkt" required><span class="option-copy">Produkt</span></label>
<label class="option-label"><input type="radio" name="occupation" value="Inne" required><span class="option-copy">Inne</span></label>
</div>
</div>
<div
class="step-card"
data-step
data-auto-advance
role="group"
aria-labelledby="stepper-project-question"
hidden
>
<p class="step-eyebrow">Twój projekt</p>
<p id="stepper-project-question" class="step-question">Czy masz już projekt na hackathon? *</p>
<div class="option-list">
<label class="option-label"><input type="radio" name="project_status" value="Tak, zbuduję coś dla zajawki" required><span class="option-copy">Tak, zbuduję coś dla zajawki</span></label>
<label class="option-label"><input type="radio" name="project_status" value="Tak, zbuduję projekt dla firmy" required><span class="option-copy">Tak, zbuduję projekt dla firmy</span></label>
<label class="option-label"><input type="radio" name="project_status" value="Nie, chcę wybrać challenge dla firmy lub fundacji" required><span class="option-copy">Nie, chcę wybrać challenge dla firmy lub fundacji</span></label>
</div>
</div>
<div
class="step-card"
data-step
data-auto-advance
role="group"
aria-labelledby="stepper-team-question"
hidden
>
<p class="step-eyebrow">Twój zespół</p>
<p id="stepper-team-question" class="step-question">Czy masz zespół na hackathon? *</p>
<div class="option-list">
<label class="option-label"><input type="radio" name="team_status" value="Nie, chcę skorzystać z matchmakingu" required><span class="option-copy">Nie, chcę skorzystać z matchmakingu</span></label>
<label class="option-label"><input type="radio" name="team_status" value="Tak, tworzę drużynę ze znajomymi" required><span class="option-copy">Tak, tworzę drużynę ze znajomymi</span></label>
<label class="option-label"><input type="radio" name="team_status" value="Tak, bierzemy udział firmowo" required><span class="option-copy">Tak, bierzemy udział firmowo</span></label>
</div>
</div>
<div
class="step-card"
data-step
data-auto-advance
role="group"
aria-labelledby="stepper-merch-question"
hidden
>
<p class="step-eyebrow">Merch · opcjonalne</p>
<p id="stepper-merch-question" class="step-question">Czy interesuje Cię limitowany merch BRAVE UnAIted?</p>
<div class="option-list">
<label class="option-label"><input type="radio" name="merch_interest" value="Tak"><span class="option-copy">Tak</span></label>
<label class="option-label"><input type="radio" name="merch_interest" value="Nie"><span class="option-copy">Nie</span></label>
</div>
</div>
<div class="step-card" data-step hidden>
<p class="step-eyebrow">Zgody</p>
<p class="step-question">Zaakceptuj regulamin wydarzenia *</p>
<div class="consent-card">
<input id="stepper-event-terms" name="event_terms" type="checkbox" value="accepted" required>
<span>
<label for="stepper-event-terms">Akceptuję </label>
<button class="terms-open" type="button" data-terms-open>regulamin wydarzenia</button>.
</span>
</div>
</div>
<div class="step-card" data-step hidden>
<p class="step-eyebrow">Ostatni krok</p>
<p class="step-question">Potwierdź politykę prywatności i newsletter *</p>
<label class="consent-card">
<input name="privacy_and_newsletter" type="checkbox" value="accepted" required>
<span>
Akceptuję
<a href="https://verybrave.link/p-policy" target="_blank" rel="noopener noreferrer">Politykę Prywatności</a>
i wyrażam zgodę na dołączenie do newslettera BRAVE Education sp. z o.o.
W każdej chwili mogę się wypisać lub zmienić swoje dane.
</span>
</label>
</div>
<section
id="stepper-success-screen"
class="success-screen"
role="region"
aria-labelledby="stepper-success-title"
hidden
>
<p class="success-eyebrow">Zgłoszenie wysłane</p>
<h3 id="stepper-success-title" class="success-title" tabindex="-1">Gotowe!</h3>
<p class="success-copy">
Twoje zgłoszenie zostało wysłane.<br>
Do zobaczenia 28 sierpnia!
</p>
<button class="nav-button success-close" type="button" data-stepper-close>Zamknij</button>
</section>
<footer id="stepper-footer" class="stepper-footer">
<button id="stepper-back" class="nav-button" type="button" disabled>Wstecz</button>
<div class="form-feedback">
<p id="stepper-status" class="form-status" aria-live="polite"></p>
<a id="stepper-fallback" class="fallback-link" href="https://luma.com/unaited" hidden>
Zarejestruj się przez Luma
</a>
</div>
<button id="stepper-next" class="nav-button nav-button-primary" type="button">Dalej</button>
<button id="stepper-submit" class="nav-button nav-button-submit" type="submit" hidden>Zapisuję się</button>
</footer>
</form>
</section>
<div id="unaited-terms-modal" aria-hidden="true">
<div class="terms-backdrop" data-terms-close></div>
<section
class="terms-dialog"
role="dialog"
aria-modal="true"
aria-labelledby="unaited-terms-title"
aria-describedby="unaited-terms-copy"
tabindex="-1"
>
<header class="terms-header">
<div class="terms-heading">
<div class="terms-icon" aria-hidden="true">
<svg viewBox="0 0 32 32" fill="none">
<rect x="8" y="5" width="17" height="23" rx="2" stroke="currentColor" stroke-width="2"/>
<path d="M12 10h9M12 15h9M12 20h9" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
<path d="M5 9v17a2 2 0 0 0 2 2h13" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
</svg>
</div>
<h3 id="unaited-terms-title" class="terms-title">Warunki wydarzenia</h3>
</div>
<button class="terms-close" type="button" aria-label="Zamknij warunki wydarzenia" data-terms-close>
<svg viewBox="0 0 20 20" fill="none" aria-hidden="true">
<path d="m5 5 10 10M15 5 5 15" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"/>
</svg>
</button>
</header>
<div class="terms-body">
<div class="terms-content">
<p id="unaited-terms-copy" class="terms-copy">
Przystąpienie do udziału w Imprezie oznacza wyrażenie przez Uczestników zgody na przetwarzanie danych osobowych przez Organizatora zgodnie z rozporządzeniem RODO. Organizator zastrzega sobie prawo do utrwalania przebiegu Imprezy w formie zapisu fotograficznego, filmowego oraz dźwiękowego w celach dokumentacyjnych, edukacyjnych i promocyjno-marketingowych, co obejmować może zarówno wizerunek jak i zachowania uczestników. Impreza może być transmitowana na żywo. Udział w Imprezie oznacza również wyrażenie zgody na nieodpłatne utrwalenie i opublikowanie swojego wizerunku w mediach wewnętrznych Organizatora oraz w mediach zewnętrznych w wyżej wskazanym zakresie.
</p>
<p class="terms-note">
Te warunki są określone przez hosta wydarzenia. W razie pytań skontaktuj się z hostem wydarzenia.
</p>
</div>
<button class="terms-accept" type="button" data-terms-accept>Zaakceptuj warunki</button>
</div>
</section>
</div>
</div>
<script id="unaited-stepper-script">
(function () {
if (window.__unaitedStepperInitialized) return;
const REGISTRATION_ENDPOINT = 'https://hook.eu1.make.com/5179h2r4a1742lnvx8hdcg3t4u0ek9h5';
const LUMA_FALLBACK_URL = 'https://luma.com/unaited';
const modal = document.getElementById('unaited-stepper-modal');
const modalDialog = modal ? modal.querySelector('.modal-dialog') : null;
const form = document.getElementById('unaited-stepper-form');
const steps = form ? Array.from(form.querySelectorAll('[data-step]')) : [];
const backButton = document.getElementById('stepper-back');
const nextButton = document.getElementById('stepper-next');
const submitButton = document.getElementById('stepper-submit');
const footer = document.getElementById('stepper-footer');
const progressMeta = document.getElementById('stepper-progress-meta');
const progressLabel = document.getElementById('stepper-progress-label');
const progressPercent = document.getElementById('stepper-progress-percent');
const progressTrack = document.getElementById('stepper-progress-track');
const progressBar = document.getElementById('stepper-progress-bar');
const status = document.getElementById('stepper-status');
const fallbackLink = document.getElementById('stepper-fallback');
const successScreen = document.getElementById('stepper-success-screen');
const successTitle = document.getElementById('stepper-success-title');
const termsModal = document.getElementById('unaited-terms-modal');
const termsDialog = termsModal ? termsModal.querySelector('.terms-dialog') : null;
const termsOpenButton = modal ? modal.querySelector('[data-terms-open]') : null;
const termsAcceptButton = modal ? modal.querySelector('[data-terms-accept]') : null;
const eventTermsCheckbox = document.getElementById('stepper-event-terms');
let currentStep = 0;
let currentSource = 'unaited.pl';
let previouslyFocusedElement = null;
let termsPreviouslyFocusedElement = null;
let submissionSucceeded = false;
if (
!modal ||
!modalDialog ||
!form ||
!steps.length ||
!backButton ||
!nextButton ||
!submitButton ||
!footer ||
!progressMeta ||
!progressLabel ||
!progressPercent ||
!progressTrack ||
!progressBar ||
!status ||
!fallbackLink ||
!successScreen ||
!successTitle ||
!termsModal ||
!termsDialog ||
!termsOpenButton ||
!termsAcceptButton ||
!eventTermsCheckbox
) {
return;
}
window.__unaitedStepperInitialized = true;
function setStatus(message, type, showFallback) {
status.textContent = message || '';
status.classList.remove('is-error', 'is-success');
fallbackLink.hidden = !showFallback;
if (type) status.classList.add(type === 'success' ? 'is-success' : 'is-error');
}
function focusCurrentStep() {
const control = steps[currentStep].querySelector(
'input:not([type="hidden"]), select, textarea, button'
);
if (control) control.focus();
}
function renderStep(index, shouldFocus) {
currentStep = Math.max(0, Math.min(index, steps.length - 1));
successScreen.hidden = true;
progressMeta.hidden = false;
progressTrack.hidden = false;
footer.hidden = false;
steps.forEach(function (step, stepIndex) {
step.hidden = stepIndex !== currentStep;
});
const percent = Math.round(((currentStep + 1) / steps.length) * 100);
progressLabel.textContent = 'Krok ' + (currentStep + 1) + ' z ' + steps.length;
progressPercent.textContent = percent + '%';
progressTrack.setAttribute('aria-valuenow', String(currentStep + 1));
progressBar.style.width = percent + '%';
backButton.disabled = currentStep === 0;
nextButton.hidden = currentStep === steps.length - 1;
submitButton.hidden = currentStep !== steps.length - 1;
setStatus('');
if (shouldFocus) {
window.requestAnimationFrame(focusCurrentStep);
}
}
function showSuccessScreen() {
submissionSucceeded = true;
form.reset();
steps.forEach(function (step) {
step.hidden = true;
});
progressMeta.hidden = true;
progressTrack.hidden = true;
footer.hidden = true;
successScreen.hidden = false;
window.requestAnimationFrame(function () {
successTitle.focus();
});
}
function resetAfterSuccess() {
if (!submissionSucceeded) return;
form.reset();
submissionSucceeded = false;
submitButton.disabled = false;
submitButton.textContent = 'Zapisuję się';
renderStep(0, false);
}
function openTermsModal(trigger) {
termsPreviouslyFocusedElement = trigger || document.activeElement;
termsModal.classList.add('is-open');
termsModal.setAttribute('aria-hidden', 'false');
modalDialog.setAttribute('aria-hidden', 'true');
window.requestAnimationFrame(function () {
termsDialog.focus();
});
}
function closeTermsModal(acceptTerms, restoreFocus) {
if (acceptTerms) {
eventTermsCheckbox.checked = true;
eventTermsCheckbox.setCustomValidity('');
}
termsModal.classList.remove('is-open');
termsModal.setAttribute('aria-hidden', 'true');
modalDialog.removeAttribute('aria-hidden');
if (restoreFocus !== false) {
const focusTarget = acceptTerms ? eventTermsCheckbox : termsPreviouslyFocusedElement;
if (focusTarget && focusTarget.focus) focusTarget.focus();
}
}
function clearControlValidation(control) {
if (!control || !control.setCustomValidity) return;
if (control.type === 'radio' && control.name) {
Array.from(form.elements).forEach(function (formControl) {
if (formControl.type === 'radio' && formControl.name === control.name) {
formControl.setCustomValidity('');
}
});
return;
}
control.setCustomValidity('');
}
function setPolishValidationMessage(control) {
clearControlValidation(control);
if (control.validity.valid) return;
let message = 'Sprawdź poprawność tego pola.';
if (control.validity.valueMissing) {
if (control.name === 'first_name') {
message = 'Wpisz imię.';
} else if (control.name === 'last_name') {
message = 'Wpisz nazwisko.';
} else if (control.name === 'email') {
message = 'Wpisz adres e-mail.';
} else if (control.name === 'event_terms') {
message = 'Zaakceptuj regulamin wydarzenia, aby przejść dalej.';
} else if (control.name === 'privacy_and_newsletter') {
message = 'Zaakceptuj politykę prywatności i zgodę newsletterową, aby wysłać zgłoszenie.';
} else if (control.type === 'radio') {
message = 'Wybierz jedną z odpowiedzi.';
} else {
message = 'Uzupełnij to pole.';
}
} else if (control.validity.typeMismatch && control.type === 'email') {
message = 'Wpisz poprawny adres e-mail.';
} else if (control.validity.typeMismatch && control.type === 'url') {
message = 'Wpisz poprawny adres URL, zaczynający się od https://.';
}
control.setCustomValidity(message);
}
function validateCurrentStep() {
const controls = Array.from(
steps[currentStep].querySelectorAll('input:not([type="hidden"]), select, textarea')
);
for (const control of controls) {
setPolishValidationMessage(control);
if (!control.checkValidity()) {
control.reportValidity();
return false;
}
}
return true;
}
function goNext() {
if (!validateCurrentStep()) return;
if (currentStep < steps.length - 1) renderStep(currentStep + 1, true);
}
function openModal(trigger) {
resetAfterSuccess();
currentSource = trigger.getAttribute('data-unaited-source') || 'unaited.pl';
previouslyFocusedElement = trigger || document.activeElement;
modal.classList.add('is-open');
modal.setAttribute('aria-hidden', 'false');
document.body.classList.add('unaited-modal-lock');
renderStep(currentStep, true);
}
function closeModal() {
if (termsModal.classList.contains('is-open')) {
closeTermsModal(false, false);
}
modal.classList.remove('is-open');
modal.setAttribute('aria-hidden', 'true');
document.body.classList.remove('unaited-modal-lock');
if (previouslyFocusedElement && previouslyFocusedElement.focus) {
previouslyFocusedElement.focus();
}
}
function trapFocus(event) {
if (event.key !== 'Tab' || !modal.classList.contains('is-open')) return;
const focusScope = termsModal.classList.contains('is-open') ? termsModal : modalDialog;
const focusableElements = Array.from(
focusScope.querySelectorAll(
'a[href], button:not([disabled]), input:not([disabled]):not([type="hidden"]):not([tabindex="-1"]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])'
)
).filter(function (element) {
return element.offsetParent !== null;
});
if (!focusableElements.length) return;
const first = focusableElements[0];
const last = focusableElements[focusableElements.length - 1];
if (event.shiftKey && document.activeElement === first) {
event.preventDefault();
last.focus();
} else if (!event.shiftKey && document.activeElement === last) {
event.preventDefault();
first.focus();
}
}
document.addEventListener('click', function (event) {
const trigger = event.target.closest('[data-unaited-stepper-register]');
const closeControl = event.target.closest('[data-stepper-close]');
const termsOpenControl = event.target.closest('[data-terms-open]');
const termsCloseControl = event.target.closest('[data-terms-close]');
const termsAcceptControl = event.target.closest('[data-terms-accept]');
if (termsAcceptControl) {
event.preventDefault();
closeTermsModal(true);
} else if (termsOpenControl) {
event.preventDefault();
openTermsModal(termsOpenControl);
} else if (termsCloseControl) {
event.preventDefault();
closeTermsModal(false);
} else if (trigger) {
event.preventDefault();
openModal(trigger);
} else if (closeControl && modal.classList.contains('is-open')) {
closeModal();
}
});
backButton.addEventListener('click', function () {
if (currentStep > 0) renderStep(currentStep - 1, true);
});
nextButton.addEventListener('click', goNext);
form.addEventListener('input', function (event) {
clearControlValidation(event.target);
});
form.addEventListener('change', function (event) {
clearControlValidation(event.target);
const current = steps[currentStep];
if (
current.hasAttribute('data-auto-advance') &&
event.target.matches('input[type="radio"]') &&
currentStep < steps.length - 1
) {
window.setTimeout(goNext, 180);
}
});
form.addEventListener('keydown', function (event) {
if (event.key !== 'Enter' || event.shiftKey || currentStep === steps.length - 1) return;
if (event.target.matches('input[type="radio"], input[type="checkbox"]')) return;
event.preventDefault();
if (event.target.name === 'first_name') {
document.getElementById('stepper-last-name').focus();
return;
}
goNext();
});
document.addEventListener('keydown', function (event) {
trapFocus(event);
if (event.key === 'Escape' && modal.classList.contains('is-open')) {
event.preventDefault();
if (termsModal.classList.contains('is-open')) {
closeTermsModal(false);
} else {
closeModal();
}
}
});
form.addEventListener('submit', async function (event) {
event.preventDefault();
setStatus('');
if (!validateCurrentStep()) return;
const values = Object.fromEntries(new FormData(form).entries());
if (values.website) {
showSuccessScreen();
return;
}
const normalizedEmail = values.email.trim().toLowerCase();
const firstName = values.first_name.trim();
const lastName = values.last_name.trim();
const fullName = firstName + ' ' + lastName;
const payload = {
event_id: values.event_id,
ticket_type_id: values.ticket_type_id,
first_name: firstName,
last_name: lastName,
name: fullName,
email: normalizedEmail,
phone: values.phone ? values.phone.trim() : null,
linkedin: values.linkedin ? values.linkedin.trim() : null,
occupation: values.occupation,
project_status: values.project_status,
team_status: values.team_status,
merch_interest: values.merch_interest || null,
event_terms: values.event_terms === 'accepted',
privacy_and_newsletter: values.privacy_and_newsletter === 'accepted',
registration_answers: [
{ question_id: 'dftyjugv', label: 'Linkedin:', answer: values.linkedin ? values.linkedin.trim() : null },
{ question_id: 'ugy1w1wo', label: 'Czym zajmujesz się na co dzień?', answer: values.occupation },
{ question_id: '1scmbpwx', label: 'Czy masz już projekt na Hackathon?', answer: values.project_status },
{ question_id: '5rbs1k04', label: 'Czy masz zespół na Hackathon?', answer: values.team_status },
{ question_id: 'sticn0og', label: 'Czy jesteś zainteresowany/-a kupnem limitowanego merchu BRAVE UnAIted?', answer: values.merch_interest || null },
{ question_id: 'c3feej96', label: 'Regulamin', answer: values.event_terms === 'accepted' },
{ question_id: '31abg5f7', label: 'Polityka prywatności i newsletter', answer: values.privacy_and_newsletter === 'accepted' }
],
source: currentSource,
idempotency_key: values.event_id + ':' + normalizedEmail,
page_url: window.location.origin + window.location.pathname,
submitted_at: new Date().toISOString()
};
submitButton.disabled = true;
submitButton.textContent = 'Zapisuję…';
setStatus('Wysyłamy zgłoszenie…');
try {
const response = await fetch(REGISTRATION_ENDPOINT, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json, text/plain, */*'
},
body: JSON.stringify(payload)
});
if (!response.ok) throw new Error('HTTP ' + response.status);
showSuccessScreen();
} catch (error) {
setStatus(
'Nie udało się wysłać zgłoszenia. Spróbuj ponownie lub skorzystaj z rejestracji awaryjnej.',
'error',
true
);
fallbackLink.href = LUMA_FALLBACK_URL;
submitButton.disabled = false;
submitButton.textContent = 'Zapisuję się';
}
});
renderStep(0, false);
})();
</script>
</body>
</html>