/* Sign-up, pending and confirmation pages (design-referenz/signup.css).
   Demo-only rules (.flow-preview, .demo-info, .thanks-demo) removed, form states added. */
.flow-page{min-height:100dvh;background-color:#141812;background-image:radial-gradient(ellipse at 20% 40%,#38511d22,transparent 60%),linear-gradient(#ddfc7805 1px,transparent 1px),linear-gradient(90deg,#ddfc7805 1px,transparent 1px);background-size:auto,64px 64px,64px 64px}
.flow-header{max-width:1300px;padding:28px 5%;border-bottom:none}.flow-back{font-size:14px;color:#b8c1ac}.flow-back:hover{color:var(--lime)}
.signup-layout{max-width:1200px;margin:30px auto 80px;padding:0 5%;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.skin-showcase{border:1px solid #536338;border-radius:26px;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#617e303d,transparent 60%),linear-gradient(145deg,#28331d,#171f12);position:relative}
.showcase-top,.showcase-bottom{display:flex;justify-content:space-between;gap:15px;padding:23px 25px;font-size:11px;letter-spacing:1.2px;color:#b1c195;line-height:1.5}
.showcase-top>span:last-child{color:#83946c;text-align:right}
.skin-glow{padding:12px 0 0;position:relative}.flow-figure{position:relative;width:min(100%,470px);aspect-ratio:1/1;margin-inline:auto;filter:drop-shadow(0 24px 25px #070d0870);animation:skin-hover 6s ease-in-out infinite}.flow-figure img{display:block;width:100%;height:100%;object-fit:contain}
.skin-plaque{text-align:center;padding:6px 20px 25px}.skin-plaque>span{font-size:11px;letter-spacing:3px;color:#a4b68b}.skin-plaque strong{display:block;font:700 clamp(30px,4vw,48px) 'Space Grotesk',sans-serif;letter-spacing:-1px;color:var(--lime);margin-top:8px}.skin-plaque p{font-size:14px;color:#b7c5a5;margin:8px 0}
.showcase-bottom{border-top:1px solid #3b4b2b;padding-block:17px;color:#82966a;font-size:10px}
.signup-copy .eyebrow{font-size:11px;letter-spacing:1.7px;color:#b6c99a;line-height:1.6}
.signup-copy h1{font-size:clamp(43px,4.8vw,67px);letter-spacing:-.01em;line-height:1.06;margin:23px 0}
.signup-lead{font-size:17px;color:#bac5ae;line-height:1.7;max-width:430px}
.signup-card{margin-top:30px}.signup-card label{display:block;font-size:14px;font-weight:600;margin-bottom:11px;color:#dbe2d0}
.email-shell{display:flex;align-items:center;gap:12px;border:1px solid #657c40;border-radius:12px;background:#0e160a;padding:0 18px;min-height:60px;box-shadow:0 0 0 5px #ddfc7805}
.email-shell:focus-within{border-color:var(--lime);box-shadow:0 0 0 4px #ddfc7825}.email-shell>span{color:#9cad87;font-size:19px}
.email-shell input{background:none;border:0;width:100%;min-width:0;color:#c2cfb2;padding:17px 0;font:inherit;font-size:16px;outline:none}.email-shell input:focus-visible{outline:none}@media(forced-colors:active){.email-shell input:focus-visible{outline:2px solid Highlight;outline-offset:2px}}
.flow-submit{width:100%;justify-content:space-between;margin-top:16px}
.privacy-copy{font-size:12px;line-height:1.7;color:#a1ae91;margin:15px 0 0}
.reward-detail{display:flex;gap:15px;align-items:center;padding:24px 0;margin-top:6px;border-bottom:1px solid #34452a}
.reward-mark{display:grid;place-items:center;width:40px;height:44px;border:1px solid #6d8545;border-radius:10px;color:var(--lime);font:700 16px 'Space Grotesk',sans-serif}
.reward-detail strong{font-size:14px;font-weight:600}.reward-detail p{font-size:13px;color:#a4b592;margin:5px 0 0}
.quiet-link{display:inline-block;color:#aabd96;font-size:14px;margin-top:23px}.quiet-link:hover{color:var(--lime)}
.flow-footer{max-width:1200px;display:flex;justify-content:space-between;gap:15px;margin:auto;padding:25px 5% 30px;border-top:1px solid #34412a;color:#9baa8b;font-size:13px}
.flow-footer>a:not(.wordmark){font-size:13px}.flow-footer>span{width:auto;border:0;padding:0;font-size:13px;color:#9baa8b}.flow-footer p{display:block!important;width:100%;font-size:11px;color:#748266;line-height:1.6;margin:0}
.thanks-main{max-width:760px;padding:10px 25px 65px;margin:auto;text-align:center}
.thanks-kicker{font-size:11px;letter-spacing:1.5px;line-height:1.7;color:#a8bd8c;display:flex;justify-content:center;align-items:center;gap:9px}.thanks-kicker>span{font-size:17px;color:var(--lime)}
.thanks-figure{position:relative;width:min(340px,82vw);aspect-ratio:1/1;margin:20px auto 25px;isolation:isolate}
.thanks-figure>.flow-figure{width:100%;filter:drop-shadow(0 10px 30px #c7ff4140)}
.halo{position:absolute;z-index:-1;border:1px solid #b8e06120;border-radius:50%;inset:4%;box-shadow:0 0 70px #b3e84b10}.halo-two{inset:15%;border-color:#c2f26335}
.figure-tag{position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);white-space:nowrap;background:#212e17ed;border:1px solid #789b43;border-radius:8px;padding:12px 24px;font:700 16px 'Space Grotesk',sans-serif;letter-spacing:2px;color:var(--lime);box-shadow:0 12px 35px #080e0860}
.figure-tag>span{display:block;font:400 9px 'DM Sans',sans-serif;letter-spacing:1.5px;margin-top:5px;color:#bdd49e}
.thanks-copy h1{font-size:clamp(48px,6vw,72px);line-height:1.03;letter-spacing:-.01em;margin:35px 0 22px}.thanks-lead{font-size:19px;line-height:1.6;color:#d5ddca}.thanks-lead strong{color:var(--lime);font-weight:600}
.thanks-mail{font-size:14px;color:#a7b497;line-height:1.6}
.next-round{border-block:1px solid #475933;margin:25px auto 5px;padding:20px;max-width:420px}.next-round span{display:block;font-size:10px;letter-spacing:1.4px;color:#9baf82;margin-bottom:10px}.next-round strong{font-size:15px;font-weight:500}
.thanks-copy>.button{justify-content:center}
.thanks-copy>.quiet-link{margin-top:5px;font-size:12px}
@keyframes skin-hover{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:950px){.signup-layout{gap:35px}.signup-copy h1{font-size:47px}.signup-lead{font-size:16px}.showcase-top{font-size:9px;letter-spacing:.6px;padding-inline:18px}.showcase-bottom{font-size:9px;letter-spacing:.5px;padding-inline:18px}}
@media(max-width:680px){.flow-header{padding:22px 6%}.flow-header .wordmark{font-size:31px}.flow-back{font-size:12px}.signup-layout{display:flex;flex-direction:column;margin:0 auto 45px;padding:0 6%;gap:28px}.skin-showcase{width:100%;max-width:440px;border-radius:19px}.showcase-top{padding:13px 16px;font-size:9px}.skin-glow{padding:0;height:220px}.skin-glow .flow-figure{height:100%;width:auto}.skin-plaque{padding:0 16px 15px}.skin-plaque strong{font-size:28px;margin-top:4px}.skin-plaque>span{font-size:9px;letter-spacing:2px}.skin-plaque p{font-size:12px;margin:4px 0}.showcase-bottom{display:none}.signup-copy{width:100%;max-width:440px}.signup-copy .eyebrow{font-size:10px}.signup-copy h1{font-size:43px;margin:17px 0}.signup-lead{font-size:16px}.signup-card{margin-top:23px}.flow-submit{padding:17px 19px;gap:12px;font-size:15px}.flow-footer{margin-inline:6%;padding:22px 0;gap:12px;align-items:center}.flow-footer>span,.flow-footer>a:not(.wordmark){font-size:11px}.flow-footer p{font-size:10px}.thanks-main{padding:5px 6% 45px}.thanks-kicker{font-size:9px;letter-spacing:.8px}.thanks-figure{width:255px;margin-top:15px}.thanks-copy h1{font-size:49px;letter-spacing:-2px;margin-top:31px}.thanks-lead{font-size:17px}.thanks-mail{font-size:13px}.thanks-copy>.button{font-size:14px;gap:20px;padding:17px 18px}.next-round{padding:18px 4px}.next-round strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.flow-figure{animation:none}}
.figure-eye{position:absolute;border-radius:50%;background:#0d100b;transform:translate(-50%,-50%)}

/* --- Real sign-up form: states the static reference did not need --- */
.signup-card{margin-top:30px}
.email-shell.is-invalid{border-color:#f45b69;box-shadow:0 0 0 4px #f45b6922}
.email-shell.is-invalid:focus-within{border-color:#f45b69}
.field-messages{margin:0}
.field-error{font-size:13px;line-height:1.6;color:#f45b69;margin:12px 0 0;min-height:0}
.field-error:empty{margin:0}
.field-error--static{display:none}
#fehler-ungueltig:target,#fehler-server:target,#error-invalid:target,#error-server:target{display:block}
.flow-submit{position:relative;transition:opacity .2s,background .2s,transform .2s}
.flow-submit[disabled]{opacity:.72;cursor:progress;transform:none}
.flow-submit[disabled]:hover{background:var(--lime);transform:none}
.flow-spinner{display:none;width:19px;height:19px;border-radius:50%;border:2px solid #1d241040;border-top-color:#1d2410;animation:flow-spin .7s linear infinite}
.is-submitting .flow-spinner{display:block}
.is-submitting .flow-arrow{display:none}
@keyframes flow-spin{to{transform:rotate(360deg)}}
.hp{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){.flow-spinner{animation:none}}

.thanks-copy h1,.signup-copy h1{overflow-wrap:break-word}

.flow-header .header-actions{gap:18px}
@media(max-width:680px){.flow-header .header-actions{gap:10px}}
