@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexMono-normal-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/IBMPlexMono-normal-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/IBMPlexMono-normal-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/IBMPlexMono-normal-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:italic;font-weight:400 700;font-display:swap;src:url('/assets/fonts/InstrumentSans-italic-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:italic;font-weight:400 700;font-display:swap;src:url('/assets/fonts/InstrumentSans-italic-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/InstrumentSans-normal-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url('/assets/fonts/InstrumentSans-normal-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root{--nlf-zug:calc(clamp(20px,5vw,64px) + min(48px,max(0px,(100vw - 1488px)/2)));--nlf-s-nah:0 8px 20px -14px rgba(0,0,0,.45);--nlf-s-raum:0 28px 56px -26px rgba(0,0,0,.50);--nlf-s-front:0 48px 96px -36px rgba(0,0,0,.58);--nlf-kante-hell:inset 0 1px 0 rgba(255,255,255,.55);--nlf-kante-dunkel:inset 0 1px 0 rgba(255,255,255,.14)}
html,body{margin:0;padding:0;background:#101316;color:#fbfaf6;font-family:'Instrument Sans',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#d59b42}
@media (hover:hover){a:hover{color:#2d659d}}
button{font:inherit;cursor:pointer}


header { position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(16px,5vw,64px);background:rgba(16,19,22,0.72);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid rgba(251,250,246,0.12);color:#fbfaf6; }
header a.logo { display:flex;align-items:center;gap:12px;min-height:28px;font-weight:600;font-size:18px;letter-spacing:-0.02em;line-height:1;color:#fbfaf6; }
@media (hover:hover){header a.logo:hover{ color:#fbfaf6; }}
header a.logo:focus { outline:2px solid #fbfaf6;outline-offset:4px; }
header nav { display:flex;align-items:center;gap:16px; }
header nav a { padding:6px 4px;min-width:24px;text-align:center;border-bottom:1px solid transparent;color:#ebe9e2; }
@media (hover:hover){header nav a:hover{ border-color:#fbfaf6;color:#fbfaf6; }}
header nav a:focus { outline:2px solid #fbfaf6;outline-offset:3px; }
header nav a[aria-current="page"] { border-color:#fbfaf6;color:#fbfaf6; }

.nlf-btn-gold { padding:15px 24px;min-height:48px;display:inline-flex;align-items:center;gap:10px;background:#fbfaf6;color:#101316;border-radius:999px;font-size:15px;font-weight:600;transition:background 200ms,gap 300ms cubic-bezier(0.2,0.8,0.2,1); }
@media (hover:hover){.nlf-btn-gold:hover{ background:#d59b42;color:#101316;gap:16px; }}
.nlf-btn-gold:focus { outline:2px solid #fbfaf6;outline-offset:3px; }

.nlf-btn-blau { padding:16px 26px;min-height:48px;display:inline-flex;align-items:center;gap:12px;background:#101316;color:#fbfaf6;border-radius:999px;font-size:15px;font-weight:600;align-self:flex-start;transition:background 200ms,gap 300ms cubic-bezier(0.2,0.8,0.2,1); }
@media (hover:hover){.nlf-btn-blau:hover{ background:#2d659d;color:#fbfaf6;gap:20px; }}
.nlf-btn-blau:focus { outline:2px solid #101316;outline-offset:3px; }

.nlf-btn-kalk { padding:15px 24px;min-height:48px;display:inline-flex;align-items:center;gap:10px;background:rgba(199,217,133,0.1);color:#c7d985;border-radius:999px;font-size:15px;font-weight:600;transition:background 200ms,gap 300ms cubic-bezier(0.2,0.8,0.2,1); }
@media (hover:hover){.nlf-btn-kalk:hover{ background:rgba(199,217,133,0.2);gap:16px; }}

.nlf-kontakt-abschluss { background:#ebe9e2;color:#101316;padding:clamp(64px,10vw,120px) clamp(20px,5vw,64px);border-radius:24px 24px 0 0;margin-top:-24px;position:relative;z-index:2;box-shadow:var(--nlf-s-raum),var(--nlf-kante-hell); }

footer { padding:48px clamp(20px,5vw,64px) 64px;background:#101316;color:#8c9399;font-size:13px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;border-top:1px solid rgba(251,250,246,0.08); }
footer a { color:#ebe9e2; }
@media (hover:hover){footer a:hover{ color:#fbfaf6; }}

/* ---- Unterseiten: Fläche, Kopfzeile, Lauftext (Gestaltung wie v12, Leader 14.09.2026) ---- */
.nlf-page { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; }
main { flex: 1 0 auto; width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 var(--nlf-zug) clamp(48px,7vw,96px); }
header nav a.nlf-btn-gold { padding: 11px 18px; min-height: 40px; border-bottom: 0; }
header nav a.nlf-btn-gold[aria-current="page"] { background: #d59b42; color: #101316; }
@media (max-width: 860px) {
  header { flex-wrap: wrap; row-gap: 8px; padding-top: 10px; padding-bottom: 10px; }
  header nav { width: 100%; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; }
  header nav a.nlf-btn-gold { order: -1; width: 100%; justify-content: center; margin-bottom: 2px; }
}

.eyebrow { display: block; font-family: 'IBM Plex Mono', monospace; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: #b8b8b2; }
.hero { padding: clamp(56px,9vw,128px) 0 clamp(40px,6vw,72px); }
.hero h1 { margin: 12px 0 0; font-weight: 600; font-size: clamp(36px,5.2vw,78px); line-height: 0.98; letter-spacing: -0.035em; max-width: 16ch; text-wrap: balance; }
.hero .lead { margin: 28px 0 0; font-size: clamp(17px,1.4vw,20px); line-height: 1.5; color: #ebe9e2; max-width: 56ch; }
.hero nav { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 28px; }
.hero nav a { color: #fbfaf6; border-bottom: 1px solid rgba(251,250,246,0.35); padding: 2px 0; min-width: 24px; text-align: center; }
@media (hover:hover){.hero nav a:hover{ color: #d59b42; border-color: #d59b42; }}

main section:not(.hero) { border-top: 1px solid rgba(251,250,246,0.16); padding: clamp(28px,4vw,48px) 0 clamp(36px,5vw,64px); }
main section .eyebrow + h2 { margin-top: 12px; }
main h2 { margin: 0 0 20px; font-weight: 600; font-size: clamp(26px,3.2vw,44px); line-height: 1.05; letter-spacing: -0.03em; max-width: 22ch; text-wrap: balance; }
main h3 { margin: 0 0 8px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: #b8b8b2; }
main p, main li, main dd { font-size: 16px; line-height: 1.6; color: #ebe9e2; }
main p { margin: 0 0 16px; max-width: 62ch; }
main p:last-child { margin-bottom: 0; }
main p em { color: #b8b8b2; }
main p strong { color: #fbfaf6; }
main ul { margin: 0; padding: 0 0 0 1.2em; max-width: 62ch; }
main li { margin: 0 0 10px; }
main li::marker { color: #d59b42; }
main dl { margin: 0; max-width: 62ch; }
main dt { font-weight: 600; color: #fbfaf6; margin-top: 20px; font-size: 17px; }
main dd { margin: 6px 0 0; }
main a { color: #d59b42; text-decoration: underline; text-underline-offset: 3px; }
@media (hover:hover){main a:hover{ color: #fbfaf6; }}
main a:focus { outline: 2px solid #fbfaf6; outline-offset: 3px; }

.nlf-preis { font-family: 'IBM Plex Mono', monospace; font-size: 13.5px; line-height: 1.7; color: #fbfaf6; padding-left: 16px; border-left: 2px solid #d59b42; }

.spalten { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(20px,3vw,40px); }
.spalten > div { border-top: 1px solid rgba(251,250,246,0.16); padding-top: 14px; }
.spalten > div:last-child h3 { color: #c7d985; }

.karten { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.nlf-karte { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; min-height: 160px; padding: 22px 24px; border-radius: 20px; background: #1a1f24; color: #fbfaf6; text-decoration: none; font-size: 18px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; box-shadow: var(--nlf-s-nah), var(--nlf-kante-dunkel); transition: background 200ms, transform 300ms cubic-bezier(0.2,0.8,0.2,1); }
@media (hover:hover){.nlf-karte:hover{ background: #2d659d; color: #fbfaf6; transform: translateY(-2px); }}
.nlf-karte:focus { outline: 2px solid #fbfaf6; outline-offset: 3px; }
.gold-pfeil { color: #d59b42; font-size: 24px; line-height: 1; flex: none; }
@media (hover:hover){.nlf-karte:hover .gold-pfeil{ color: #fbfaf6; }}

/* Belege (aus #belege der Startseite uebernommen; Inline-Stile bleiben) */
.nlf-belege > div { max-width: none !important; }

/* Ebenen-Stapel auf /software/: CSS-Stapel, Canvas ersetzt ihn nur bei Bewegung + WebGL2 + Sichtfeld */
.nlf-3d { position: relative; width: 100%; max-width: 720px; aspect-ratio: 16 / 10; margin: 28px 0 16px; border-radius: 24px; background: radial-gradient(120% 90% at 50% 110%, rgba(45,101,157,0.35), rgba(16,19,22,0) 60%); overflow: hidden; }
.nlf-3d canvas { display: block; width: 100%; height: 100%; }
.nlf-3d:focus { outline: 2px solid #fbfaf6; outline-offset: 3px; }
#ebenen-css-stapel { position: absolute; inset: 0; display: grid; place-items: center; perspective: 1200px; }
.nlf-platte { grid-area: 1 / 1; width: min(62%, 420px); aspect-ratio: 16 / 10; border-radius: 18px; background: #2b6cb0; box-shadow: var(--nlf-s-raum), var(--nlf-kante-hell); color: #fbfaf6; font-family: 'IBM Plex Mono', monospace; font-size: 12px; letter-spacing: 0.04em; padding: 14px 16px; transform: rotateX(56deg) rotateZ(-28deg) translateZ(var(--hub, 0px)); }
.nlf-platte:nth-child(1) { --hub: 120px; background: #2f70b5; }
.nlf-platte:nth-child(2) { --hub: 40px; background: #2762a2; }
.nlf-platte:nth-child(3) { --hub: -40px; background: #1f4f83; }
.nlf-status { position: absolute; right: 8%; bottom: 10%; padding: 8px 14px; border-radius: 999px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 500; letter-spacing: 0.04em; box-shadow: var(--nlf-s-nah); }
.nlf-3d + p { font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: #8c9399; }

/* Handlung + Textlink (Abschluss-Block, Formular) */
.nlf-handlung { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 28px; }
.nlf-textlink { color: inherit; text-decoration: underline; text-underline-offset: 3px; padding: 3px 0; }
@media (hover:hover){.nlf-textlink:hover{ color: #2d659d; }}
.nlf-kontakt-abschluss h2 { margin: 0 0 16px; font-weight: 600; font-size: clamp(28px,3.6vw,52px); line-height: 1.02; letter-spacing: -0.035em; max-width: 18ch; text-wrap: balance; }
.nlf-kontakt-abschluss p { margin: 0; font-size: clamp(16px,1.3vw,19px); line-height: 1.55; color: #2b2f33; max-width: 52ch; }
.nlf-kontakt-abschluss .nlf-btn-gold { background: #101316; color: #fbfaf6; }
@media (hover:hover){.nlf-kontakt-abschluss .nlf-btn-gold:hover{ background: #d59b42; color: #101316; }}
@media (hover:hover){.nlf-kontakt-abschluss .nlf-textlink:hover{ color: #2d659d; }}
footer nav { display: flex; flex-wrap: wrap; gap: 4px 16px; }
footer nav a { padding: 5px 0; min-width: 24px; text-align: center; }

/* Kontaktformular (V6.1) */
.nlf-form { display: grid; gap: 22px; max-width: 640px; }
.nlf-feld label { display: block; margin-bottom: 8px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: #b8b8b2; }
.nlf-feld input, .nlf-feld select, .nlf-feld textarea { width: 100%; padding: 14px 16px; font: inherit; font-size: 16px; line-height: 1.4; color: #fbfaf6; background: rgba(251,250,246,0.06); border: 1px solid rgba(251,250,246,0.22); border-radius: 14px; box-shadow: var(--nlf-kante-dunkel); }
.nlf-feld select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #b8b8b2 50%), linear-gradient(135deg, #b8b8b2 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.nlf-feld select option { color: #101316; background: #fbfaf6; }
.nlf-feld textarea { min-height: 180px; resize: vertical; }
.nlf-feld input:focus, .nlf-feld select:focus, .nlf-feld textarea:focus { outline: 2px solid #d59b42; outline-offset: 2px; border-color: rgba(251,250,246,0.4); }
.nlf-honig { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.nlf-hinweis { font-size: 13.5px; line-height: 1.55; color: #8c9399; max-width: 56ch; }
.nlf-form .nlf-handlung { margin-top: 4px; }
.nlf-form button.nlf-btn-gold { border: 0; }

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: 220ms cubic-bezier(.2,.8,.2,1) both nlfVtOut; }
  ::view-transition-new(root) { animation: 220ms cubic-bezier(.2,.8,.2,1) both nlfVtIn; }
  @keyframes nlfVtOut { to { opacity: 0; } }
  @keyframes nlfVtIn { from { opacity: 0; } }
}

/* v14: Vorgaenge (Branchen), Rechner (KI), Ablauf-Dauer (Ueber) */
.nlf-vorgaenge-liste { margin-top: 8px; border-top: 1px solid rgba(251,250,246,0.16); }
.nlf-vorgaenge details { border-bottom: 1px solid rgba(251,250,246,0.16); }
.nlf-vorgaenge summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 48px; padding: 12px 0; font-weight: 600; font-size: 17px; color: #fbfaf6; }
.nlf-vorgaenge summary::-webkit-details-marker { display: none; }
.nlf-vorgaenge summary::after { content: '+'; color: #d59b42; font-family: 'IBM Plex Mono', monospace; font-size: 20px; flex: none; }
.nlf-vorgaenge details[open] summary::after { content: '\2013'; }
@media (hover:hover){.nlf-vorgaenge summary:hover{ color: #d59b42; }}
.nlf-vorgaenge summary:focus-visible { outline: 2px solid #fbfaf6; outline-offset: 3px; }
.nlf-vorgaenge .spalten { padding: 4px 0 24px; }
.nlf-vorgaenge .spalten ul { list-style: none; padding: 0; }
.nlf-vorgaenge .spalten li { padding-left: 18px; position: relative; }
.nlf-vorgaenge .spalten > div:first-child li::before { content: '\2013'; position: absolute; left: 0; color: #c95443; }
.nlf-vorgaenge .spalten > div:last-child li::before { content: '\2192'; position: absolute; left: 0; color: #c7d985; }
.nlf-rechner { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: clamp(20px,3vw,40px); margin-top: 8px; }
.nlf-rechner-eingabe { display: flex; flex-direction: column; gap: 18px; }
.nlf-rechner-eingabe h3 { font-family: inherit; font-size: 20px; text-transform: none; letter-spacing: -0.02em; color: #fbfaf6; }
.nlf-rechner label { display: flex; flex-direction: column; gap: 8px; font-size: 15px; color: #ebe9e2; }
.nlf-rechner label > span { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.nlf-rechner output { font-weight: 600; color: #fbfaf6; }
.nlf-rechner input[type=range] { width: 100%; height: 28px; margin: 0; accent-color: #d59b42; cursor: pointer; }
.nlf-rechner-ergebnis { display: flex; flex-direction: column; gap: 14px; background: #1a1f24; border-radius: 16px; padding: 24px; }
.nlf-rechner-ergebnis strong { font-weight: 600; font-size: clamp(32px,4vw,48px); letter-spacing: -0.04em; line-height: 1; color: #fbfaf6; }
.nlf-rechner-balken { height: 10px; background: rgba(251,250,246,0.12); border-radius: 999px; overflow: hidden; }
.nlf-rechner-balken > div { height: 100%; width: 0; background: #2d659d; border-radius: 999px; transition: width 400ms cubic-bezier(0.2,0.8,0.2,1); }
.nlf-rechner-ergebnis p { border-top: 1px solid rgba(251,250,246,0.15); padding-top: 12px; }
.nlf-dauer { font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 400; letter-spacing: 0.06em; color: #b8b8b2; margin-left: 8px; }
