/* ETF for Everybody – Kurs · v1.0.0
   Anmeldeseite (im Theme, body.etf-page) und Bestätigungsseite (eigenständig).
   Farben wie im CFF-Kurs. Keine Regel greift außerhalb dieser Seiten. */

/* ---------- Seite im Theme: dunkel wie die Rechtsseiten ---------- */
body.etf-page{ background:#050806 !important; color:#F3F5F2; }
body.etf-page .wp-site-blocks,
body.etf-page .wp-site-blocks > *,
body.etf-page .has-background,
body.etf-page .has-base-background-color,
body.etf-page .has-tertiary-background-color{ background:#050806 !important; }
body.etf-page .wp-block-site-title a,
body.etf-page .wp-block-navigation a,
body.etf-page .wp-block-navigation__responsive-container-open,
body.etf-page .wp-block-navigation__responsive-container-close,
body.etf-page footer,
body.etf-page footer a{ color:#F3F5F2 !important; }
body.etf-page .wp-block-navigation__responsive-container.is-menu-open{ background:#050806 !important; }
body.etf-page .wp-block-social-link svg{ fill:#F3F5F2 !important; }
body.etf-page main .wp-block-post-title{ display:none !important; }
body.etf-page main .wp-block-post-content,
body.etf-page main .entry-content{ max-width:none !important; }

/* ---------- Bausteine ---------- */
.etf-su, .etf-gate{
  --etf-bg:#050806; --etf-l1:#0A0F0C; --etf-l2:#0E1411; --etf-ln:#1C2721; --etf-ln2:#26342C;
  --etf-tx:#F3F5F2; --etf-tx2:#8A968F; --etf-tx3:#59655E; --etf-em:#3DDC97; --etf-em2:#2BB47B; --etf-red:#E5484D;
  font:400 16px/1.6 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--etf-tx); -webkit-font-smoothing:antialiased;
}
.etf-su *, .etf-gate *{ box-sizing:border-box; }
.etf-su{ display:flex; justify-content:center; padding:clamp(8px,3vw,40px) 0 clamp(24px,5vw,64px); }
.etf-card{
  width:100%; max-width:580px; margin:0 auto;
  padding:clamp(24px,5vw,44px) clamp(18px,5vw,44px);
  border:1px solid var(--etf-ln); border-radius:14px; background:var(--etf-l1);
}
.etf-eyebrow{ margin:0 0 18px !important; font:600 .72rem/1.3 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.16em; text-transform:uppercase; color:var(--etf-em) !important; }
.etf-h1{ margin:0 0 12px !important; font-size:clamp(1.65rem,5vw,2.2rem) !important; line-height:1.15 !important; font-weight:700 !important; letter-spacing:-.015em; color:var(--etf-tx) !important; }
.etf-lead{ margin:0 0 22px !important; color:var(--etf-tx2) !important; font-size:1.02rem; }
.etf-checks{ margin:0 0 26px !important; padding:0 !important; list-style:none !important; display:grid; gap:10px; }
.etf-checks li{ display:flex; gap:12px; align-items:flex-start; margin:0 !important; color:#C9D1CC; font-size:.97rem; }
.etf-checks li span{ flex:none; width:20px; height:20px; margin-top:2px; border-radius:50%; border:1px solid var(--etf-ln2); display:grid; place-items:center; color:var(--etf-em); font-size:.72rem; line-height:1; }

.etf-form{ display:grid; gap:14px; margin:0; }
.etf-field{ display:grid; gap:6px; margin:0; }
.etf-field > span{ font-size:.92rem; font-weight:600; color:var(--etf-tx); }
.etf-field > span em{ font-style:normal; font-weight:400; color:var(--etf-tx3); margin-left:6px; }
.etf-field input{
  width:100%; min-height:50px; margin:0; padding:12px 14px;
  border:1px solid var(--etf-ln2); border-radius:8px; background:var(--etf-bg); color:var(--etf-tx);
  font:inherit; font-size:1rem; outline:none; box-shadow:none;
}
.etf-field input:focus{ border-color:var(--etf-em); }
.etf-field.is-error input{ border-color:var(--etf-red); }
.etf-pw{ position:relative; display:block; }
.etf-pw input{ padding-right:96px; }
.etf-pw__toggle{
  position:absolute; top:50%; right:8px; transform:translateY(-50%);
  min-height:34px; padding:6px 10px; border:1px solid var(--etf-ln2); border-radius:6px;
  background:transparent; color:var(--etf-tx2); font:inherit; font-size:.82rem; cursor:pointer;
}
.etf-pw__toggle:hover{ color:var(--etf-tx); border-color:var(--etf-tx3); }

.etf-box{
  display:flex; gap:14px; align-items:flex-start; margin:0;
  padding:16px; border:1px solid var(--etf-ln2); border-radius:10px; background:var(--etf-bg);
  cursor:pointer; font-size:.92rem; line-height:1.6; color:#C9D1CC;
}
.etf-box input{ flex:none; width:22px; height:22px; margin:1px 0 0; accent-color:var(--etf-em); cursor:pointer; }
.etf-box.is-error{ border-color:var(--etf-red); }
.etf-box--soft{ border-style:dashed; }
.etf-box em{ font-style:normal; color:var(--etf-tx3); }

.etf-btn{
  display:block; width:100%; min-height:54px; margin:6px 0 0; padding:14px 20px;
  border:0; border-radius:8px; background:var(--etf-em); color:#050806 !important;
  font:inherit; font-size:1.05rem; font-weight:700; line-height:1.2; text-align:center; text-decoration:none !important;
  cursor:pointer; transition:background .15s ease;
}
.etf-btn:hover{ background:var(--etf-em2); }
.etf-btn:disabled{ background:var(--etf-ln); color:#56625B !important; cursor:not-allowed; }

.etf-fine{ margin:4px 0 0 !important; font-size:.84rem; line-height:1.55; color:var(--etf-tx3) !important; }
.etf-fine a, .etf-alt a, .etf-error a{ color:var(--etf-em) !important; }
.etf-risk{ margin:2px 0 0 !important; padding:10px 0 0 12px; border-left:2px solid var(--etf-ln2); font-size:.8rem; line-height:1.55; color:var(--etf-tx3) !important; }
.etf-alt{ margin:20px 0 0 !important; text-align:center; font-size:.92rem; color:var(--etf-tx2) !important; }
.etf-error{ margin:0 0 16px !important; padding:12px 14px; border:1px solid var(--etf-red); border-radius:8px; color:#FF8A8E !important; font-size:.92rem; }
.etf-note{ margin:0 0 16px !important; padding:12px 14px; border:1px solid var(--etf-ln2); border-radius:8px; color:#C9D1CC !important; font-size:.92rem; }
.etf-note--warn{ border-style:dashed; border-color:#F5A524; color:#F5A524 !important; }
.etf-hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

/* ---------- Bestätigungsseite (eigenständig) ---------- */
html, body.etf-gate-body{ margin:0; min-height:100%; background:#050806; }
.etf-gate{ min-height:100vh; display:grid; place-items:center; padding:24px 16px; }
.etf-gate .etf-btn{ margin-top:18px; }
.etf-gate .etf-error{ margin:12px 0 0 !important; }
.etf-gate .etf-fine{ margin-top:16px !important; text-align:center; }

@media (max-width:420px){
  .etf-card{ border-radius:12px; }
  .etf-box{ padding:14px; gap:12px; }
}

/* ---------- Anmelden mit bestehendem Konto (1.0.3) ---------- */
.etf-login{ margin:22px 0 0; border-top:1px solid var(--etf-ln); padding-top:6px; }
.etf-login > summary{ list-style:none; cursor:pointer; padding:12px 0; }
.etf-login > summary::-webkit-details-marker{ display:none; }
.etf-login > summary span{ color:var(--etf-em); text-decoration:underline; font-weight:600; }
.etf-login > summary:focus-visible{ outline:2px solid var(--etf-em); outline-offset:4px; border-radius:6px; }
.etf-login[open] > summary{ margin-bottom:10px; }
.etf-login__form{ margin-top:4px; }
.etf-login__form .etf-fine{ text-align:center; }
.etf-login:first-of-type{ }
.etf-su__card > .etf-login[open], .etf-card > .etf-login[open]{ }
details.etf-login + .etf-alt--new{ margin:6px 0 18px !important; padding-bottom:18px; border-bottom:1px solid var(--etf-ln); }
