/* Ausgelagert aus anmelden.html am 29.09.2026 (CSP: keine Inline-Stile). */
/* Stand 20.09.2026, Entwurf "Kapitalkurve". Eigene, kleine Fassung der
   Markenwerte. Die grosse stil.css wird hier bewusst nicht geladen: Diese
   Seite steht vor der Anmeldung, sie soll sofort da sein und nichts
   verraten. Kein dunkler Modus, wie ueberall. */
:root {
  --papier:#F7FAF8; --karte:#FFFFFF;
  --tinte:#16352A; --tinte-zweit:#3F4B46; --tinte-still:#6C7873;
  --linie:#DCE6E0; --linie-fein:#E9F0EC;
  --messing:#C7A15F; --messing-tief:#A0782F;
  --nacht:#0E2019; --nacht-linie:rgba(199,161,95,.22);
  --baerisch:#8E4A3A;
  --serif:"Iowan Old Style", Charter, Palatino, Georgia, serif;
  --grotesk:"Avenir Next","Avenir","Segoe UI",system-ui,-apple-system,sans-serif;
}
* { box-sizing:border-box; }
html, body { min-height:100%; }
body {
  margin:0; background:var(--papier); color:var(--tinte); font:15px/1.55 var(--grotesk);
  display:grid; grid-template-columns:1.1fr .9fr; min-height:100dvh;
}

/* Linke Buehne */
.buehne {
  background:var(--nacht); color:#EAF1ED; padding:54px 52px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden;
}
.buehne::after {
  content:""; position:absolute; inset:0;
  background:radial-gradient(80% 55% at 75% 90%, rgba(199,161,95,.14), transparent 70%);
}
.buehne > * { position:relative; z-index:1; }
.marke {
  font:600 10.5px/1.2 var(--grotesk); letter-spacing:.17em; text-transform:uppercase;
  color:var(--messing); display:flex; align-items:center; gap:10px; margin:0;
}
.marke::after { content:""; flex:1; height:1px; background:var(--nacht-linie); }
.claim { font:400 38px/1.16 var(--serif); margin:26px 0 12px; max-width:15ch; letter-spacing:-.01em; }
.satz { color:rgba(234,241,237,.7); font-size:14.5px; max-width:32ch; margin:0; }
figure { margin:28px 0 0; }
figure svg { width:100%; height:auto; display:block; }
figcaption {
  margin:10px 0 0; font:500 10.5px/1.2 var(--grotesk); letter-spacing:.1em;
  text-transform:uppercase; color:rgba(234,241,237,.45);
}
.zahlen {
  display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:34px 0 0;
  border-top:1px solid rgba(234,241,237,.12); padding-top:20px;
}
.zahlen div b { display:block; font:400 24px/1.1 var(--serif); color:#EAF1ED; margin:0 0 4px; }
.zahlen div span {
  font:500 10.5px/1.2 var(--grotesk); letter-spacing:.1em; text-transform:uppercase;
  color:rgba(234,241,237,.5);
}

/* Rechte Seite, das Formular */
.formular { display:grid; place-items:center; padding:40px 44px; }
.innen { width:100%; max-width:330px; }
h1 { font:400 28px/1.14 var(--serif); margin:0 0 6px; letter-spacing:-.005em; }
.unter { color:var(--tinte-still); font-size:13.5px; margin:0 0 30px; }
label {
  display:block; font:600 10.5px/1.2 var(--grotesk); letter-spacing:.1em;
  text-transform:uppercase; color:var(--tinte-still); margin:0 0 7px;
}
input {
  width:100%; padding:12px 0; margin:0 0 22px; border:0; border-bottom:1px solid var(--linie);
  background:transparent; color:var(--tinte); font:16px/1.4 var(--grotesk);
  transition:border-color .16s;
}
input:focus { outline:none; border-bottom-color:var(--messing-tief); }
input::placeholder { color:#B7C0BB; }
button {
  width:100%; padding:13px; border:0; border-radius:2px; cursor:pointer;
  background:var(--tinte); color:#F7FAF8; font:600 13px/1 var(--grotesk);
  letter-spacing:.04em; transition:background .16s;
}
button:hover:not(:disabled) { background:#0F2A20; }
button:disabled { opacity:.5; cursor:default; }
.meldung { min-height:20px; margin:14px 0 0; font-size:13px; color:var(--baerisch); }
.fuss { margin:18px 0 0; font-size:12px; color:var(--tinte-still); line-height:1.6; }

@media (max-width:880px) {
  body { grid-template-columns:1fr; }
  .buehne { padding:34px 26px 28px; }
  .claim { font-size:30px; max-width:19ch; margin-top:20px; }
  .zahlen { margin-top:26px; gap:14px; }
  .formular { padding:32px 26px 44px; }
}

/* Frueher style-Attribute (CSP, 29.09.2026) */
#zieladr.zieladr { color:var(--tinte); font-weight:600; }
input#code.codefeld { font:600 26px/1.2 var(--serif); letter-spacing:.28em; text-align:center; }
a#neu.neuanfordern { color:var(--tinte-still); }