/* EV-Wireframe · originalgetreu in Schwarz-Weiß · nur Struktur, Texte echt, Bilder als Platzhalter */
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, Arial, sans-serif;
  color: #111; background: #fff; line-height: 1.55;
}
img { max-width: 100%; }

/* Ist/Soll-Umschalter (Phase 2) — kleiner Radio-Kasten oben rechts, schwebt über der Simulation */
.mode-switch {
  position: fixed; top: 8px; right: 10px; z-index: 100;
  background: #fff; border: 1px solid #111; padding: 7px 10px; font-size: 12px; line-height: 1.45;
}
.ms-title { display: block; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: #999; margin-bottom: 3px; }
.mode { display: flex; align-items: center; gap: 6px; text-decoration: none; color: #111; padding: 1px 0; }
.mode .dot { width: 11px; height: 11px; border: 1.5px solid #111; border-radius: 50%; box-sizing: border-box; flex: none; }
.mode.active { font-weight: 600; }
.mode.active .dot { background: #111; box-shadow: inset 0 0 0 2.5px #fff; }

/* Founder-Challenge-Band (im Original farbig; hier dunkel) */
.fc-band {
  background: #222; color: #fff; text-align: center;
  padding: 14px 16px; font-size: 14px;
}
.fc-band strong { display: block; letter-spacing: .1em; margin-bottom: 4px; font-size: 13px; }
.fc-band .fc-btn { display: inline-block; border: 1px solid #fff; padding: 5px 14px; margin-top: 8px; font-size: 13px; }

/* Kopf + Navigation */
header { border-bottom: 1px solid #111; position: sticky; top: 0; background: #fff; z-index: 40; }
.bar { display: flex; align-items: center; justify-content: space-between; padding: 12px 20px; }
.logo { font-weight: 700; font-size: 18px; text-decoration: none; color: inherit; cursor: pointer; }
nav ul { list-style: none; margin: 0; padding: 0 12px 8px; display: flex; flex-wrap: wrap; gap: 3px; }
nav > ul > li { position: relative; }
nav a { display: block; text-decoration: none; color: #111; padding: 6px 10px; border: 1px solid #111; font-size: 13px; white-space: nowrap; }
nav a:hover { background: #111; color: #fff; }
nav a.todo { border-style: dashed; color: #666; }
nav ul ul { display: none; position: absolute; z-index: 20; list-style: none; margin: 0; padding: 4px; background: #fff; border: 1px solid #111; min-width: 210px; }
nav li:hover > ul { display: block; }
nav ul ul a { border: none; border-bottom: 1px dotted #bbb; }
.lang { margin-left: auto; display: flex; gap: 3px; }

/* Sektionen */
section { border-bottom: 1px dashed #ccc; }
.wrap { max-width: 1040px; margin: 0 auto; padding: 40px 20px; }
.sec-label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: #aaa; margin: 0 0 18px; }
h1 { font-size: 34px; text-transform: uppercase; margin: 0 0 14px; line-height: 1.15; }
h2 { font-size: 24px; margin: 0 0 12px; }
h3 { font-size: 20px; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .02em; }
p { margin: 0 0 12px; max-width: 62ch; }

/* Bild-Platzhalter */
.img-ph {
  background: repeating-linear-gradient(45deg,#ededed,#ededed 10px,#f6f6f6 10px,#f6f6f6 20px);
  border: 1px solid #ccc; display: flex; align-items: center; justify-content: center;
  color: #999; font-size: 12px; min-height: 160px;
}
.img-ph.hero { min-height: 340px; }
.img-ph.portrait { min-height: 150px; }
.img-ph.logo { min-height: 60px; }

/* Buttons (Original meist in Versalien) */
.btn { display: inline-block; border: 2px solid #111; padding: 11px 22px; font-size: 14px; margin: 6px 8px 0 0; text-decoration: none; color: #111; }
.btn.ghost { border-style: dashed; color: #555; }

/* Layout-Helfer */
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.sponsors { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; align-items: center; }
.sponsors .img-ph.logo { flex: 1; min-width: 120px; max-width: 170px; }
.gallery { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.gallery figure { margin: 0; text-align: center; }
.gallery figcaption { font-size: 12px; margin-top: 6px; }
.quotes { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.quote { border: 1px solid #111; padding: 18px; font-size: 14px; font-style: italic; }
.center { text-align: center; }
.center p { margin-left: auto; margin-right: auto; }

/* Spenden-IBAN */
.iban { font-family: ui-monospace, monospace; border: 1px solid #111; padding: 10px 14px; display: inline-block; margin: 6px 0 14px; font-size: 14px; }

/* Footer */
footer { background: #111; color: #eee; }
.footer-wrap { max-width: 1040px; margin: 0 auto; padding: 40px 20px; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 30px; }
footer h4 { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 12px; color: #fff; }
footer a, footer p { color: #ccc; font-size: 14px; text-decoration: none; display: block; margin: 4px 0; }
.footer-btn { border: 1px solid #fff; color: #fff; padding: 9px 16px; display: inline-block; margin: 6px 6px 0 0; font-size: 13px; }
.legal { border-top: 1px solid #444; text-align: center; padding: 14px; font-size: 12px; color: #aaa; }

@media (max-width: 760px) {
  .two, .hero-grid, .footer-wrap { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(3,1fr); }
  .quotes { grid-template-columns: 1fr; }
  .mode-switch { position: absolute; }
}

/* --- Übergangs-Altlasten: hält die noch nicht neu gebauten Seiten lesbar --- */
.page-url { font-size: 12px; color: #888; margin: 0 20px 16px; }
.block { border: 1.5px solid #111; padding: 16px; margin: 0 20px 18px; }
.block > h2 { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #444; border-bottom: 1px solid #ccc; padding-bottom: 6px; }
.ph { background: #ececec; border: 1px solid #ccc; }
.ph-text { height: 10px; margin: 6px 0; }
.ph-text.w90{width:90%}.ph-text.w75{width:75%}.ph-text.w60{width:60%}
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.card { border: 1px solid #111; padding: 14px; }
.note { font-size: 12px; color: #888; font-style: italic; }

/* ===================================================================
   Konverter-Klassen — Modultypen, die convert.py erzeugt (Schwarz-Weiß)
   Handgebaute Startseite nutzt diese nicht; alle uebrigen Seiten schon.
   =================================================================== */

/* Mehrspaltige Divi-Reihen (aus et_pb_column_1_2 / _1_3 / _1_4) */
.cols { display: grid; gap: 30px; align-items: start; margin: 0 0 10px; }
.cols-2 { grid-template-columns: repeat(2, 1fr); }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
.cols-4 { grid-template-columns: repeat(4, 1fr); }
.cols-5 { grid-template-columns: repeat(5, 1fr); }
/* Programm-Modulreihe: schmales Porträt · breiter Modultext · schmaler Termin (Business Angel Class) */
.cols-modul { grid-template-columns: 1.1fr 2.6fr 1.1fr; }
/* Nummerierte Modulreihe: große Nummer · breiter Titel + Text (Business Angel BootCamp) */
.cols-nr { grid-template-columns: 0.7fr 6fr; align-items: start; }
.modul-nr { font-size: 46px; font-weight: 700; line-height: 1; color: #111; }
.modul-txt h4 { margin: 0 0 8px; font-size: 17px; }
.modul-txt p { font-size: 14px; margin: 0; max-width: 70ch; }
.cols .col > :first-child { margin-top: 0; }

/* Team-/Personen-Kachel (Portraet + Name + Rolle) — Kernteam, Netzwerk, Regional Leads */
.member { text-align: center; font-size: 14px; font-weight: 600; margin: 8px 0 0; line-height: 1.3; }
.member span { display: block; font-weight: 400; font-size: 12px; color: #666; margin-top: 2px; }

/* Statistik-Kachel (et_pb_number_counter) */
.stat { border: 1px solid #111; padding: 12px 16px; margin: 0 0 8px;
        display: inline-flex; flex-direction: column; min-width: 84px; }
.stat-num { font-size: 30px; font-weight: 700; line-height: 1.1; }
.stat-label { font-size: 12px; color: #666; margin-top: 4px; }

/* Angebots-Kaertchen (et_pb_blurb) */
.card-blurb { border: 1px solid #111; padding: 16px; height: 100%; }
.card-blurb h4 { margin: 0 0 8px; font-size: 15px;
                 text-transform: uppercase; letter-spacing: .02em; }
.card-blurb p { font-size: 14px; margin: 0 0 8px; }

/* FAQ / Aufklapper (et_pb_toggle & et_pb_accordion) */
.faq { border: 1px solid #111; margin: 0 0 8px; }
.faq-item { border-bottom: 1px solid #ccc; padding: 12px 16px; }
.faq-item:last-child { border-bottom: none; }
.faq-item h4 { margin: 0; font-size: 15px; }
.faq-item h4::before { content: "▸ "; color: #999; }
.faq-a { font-size: 14px; color: #333; margin-top: 6px; }
.faq-a p { margin: 0 0 6px; }

/* ===================================================================
   LISTEN-MUSTER (Blaupause: Presse zuerst → später Events/Blog)
   Prinzip: Übersicht + wenige echte Einträge + graue "…+N weitere"-Andeutung.
   Nicht alle Einträge nachbauen.
   Presse-Sonderfall: jede Kachel verlinkt NACH AUSSEN zum jeweiligen Medium
   → KEINE eigene Detailseite; der externe Klick wird als Hinweis angedeutet.
   =================================================================== */

/* Presse-Kachel: Vorschaubild · Quelle · Titel · (Teaser) · externer Ziel-Hinweis */
.presse-item { border: 1px solid #111; display: flex; flex-direction: column; }
.presse-item .img-ph { min-height: 150px; border: none; border-bottom: 1px solid #ccc; }
.presse-item .quelle { font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
                       color: #666; margin: 14px 16px 6px; }
.presse-item .titel { font-size: 18px; line-height: 1.25; margin: 0 16px 10px; }
.presse-item .teaser { font-size: 14px; color: #333; margin: 0 16px 12px; max-width: none; }
.presse-item .ext { margin: auto 16px 14px; font-size: 12px; color: #555;
                    border-top: 1px dotted #bbb; padding-top: 10px; }
.presse-item .ext::before { content: "↗ "; }

/* Graue "…+N weitere"-Andeutung — der wiederverwendbare Listen-Baustein */
.list-more {
  background: repeating-linear-gradient(45deg,#f3f3f3,#f3f3f3 12px,#fafafa 12px,#fafafa 24px);
  border: 1px dashed #bbb; color: #777; text-align: center;
  padding: 26px 20px; margin: 8px 0 0; font-size: 14px;
}
.list-more strong { display: block; font-size: 15px; color: #555; margin-bottom: 5px; }

/* ===================================================================
   EVENTS-LISTE (The Events Calendar, Listenansicht)
   Kalender-Bedienleiste = Konnektor-Andeutung; Termine als Datums-Badge + Inhalt.
   Detailseiten sind EV-eigen; Ticketing laeuft extern ueber Eventbrite (Platzhalter).
   =================================================================== */
.cal-bar { border: 1px solid #111; padding: 12px 16px; display: flex; flex-wrap: wrap;
           gap: 10px; align-items: center; margin: 0 0 6px; font-size: 13px; color: #555; }
.cal-bar .cal-search { flex: 1; min-width: 180px; height: 30px; border: 1px solid #bbb;
           background: repeating-linear-gradient(45deg,#f4f4f4,#f4f4f4 10px,#fafafa 10px,#fafafa 20px); }
.cal-bar .cal-btn { border: 1px solid #111; padding: 5px 12px; }
.cal-bar .cal-views { margin-left: auto; display: flex; gap: 12px; }
.cal-note { font-size: 12px; color: #888; font-style: italic; margin: 0 0 18px; }
.cal-month { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: #999;
             border-bottom: 1px solid #ccc; padding-bottom: 6px; margin: 24px 0 8px; }
.event-item { display: grid; grid-template-columns: 72px 1fr; gap: 20px;
              padding: 16px 0; border-bottom: 1px solid #eee; align-items: start; }
.event-badge { border: 1px solid #111; text-align: center; padding: 8px 4px; }
.event-badge .wd { font-size: 11px; text-transform: uppercase; color: #666; letter-spacing: .05em; }
.event-badge .day { font-size: 26px; font-weight: 700; line-height: 1.1; }
.event-when { font-size: 13px; color: #666; margin: 0 0 4px; }
.event-title { font-size: 20px; margin: 0 0 6px; line-height: 1.2; }
.event-title a { color: #111; text-decoration: none; border-bottom: 1px solid #bbb; }
.event-where { font-size: 13px; font-weight: 700; margin: 0 0 8px; }
.event-teaser { font-size: 14px; color: #333; margin: 0; max-width: none; }

/* Event-Detailseite: Meta-Zeile + Fakten-Kasten */
.event-meta { font-size: 14px; color: #444; margin: 0 0 20px; }
.event-meta span { display: inline-block; margin-right: 18px; }
.event-meta span::before { content: "\2022  "; color: #999; }
.event-meta span:first-child::before { content: ""; }

@media (max-width: 760px) {
  .cols-2, .cols-3, .cols-4, .cols-modul, .cols-nr { grid-template-columns: 1fr; }
  .cols-5 { grid-template-columns: repeat(2, 1fr); }
  .event-item { grid-template-columns: 60px 1fr; gap: 14px; }
}

/* ===================================================================
   FORMULAR-/KONNEKTOR-PLATZHALTER (Blaupause: Anmelde-/Bewerbungs-Seiten)
   Externe Formulare (Airtable, Newsletter-Widget, Divi-Kontaktformular) werden
   in Phase 1 NICHT nachgebaut. Stattdessen: ein klar beschrifteter Platzhalter,
   der Art, Anbieter und ungefaehre Laenge andeutet. Wiederverwendbar fuer alle
   Anmelde-/Apply-/Kontakt-Seiten. Dunkler Kopf = "externer Dienst".
   =================================================================== */
.form-ph { border: 1.5px solid #111; background: #fff; }
.form-ph .fh {
  background: #222; color: #fff; padding: 12px 18px; font-size: 13px;
  letter-spacing: .03em; display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.form-ph .fh strong { font-size: 14px; }
.form-ph .fh .tag {
  border: 1px solid #fff; padding: 2px 8px; font-size: 11px;
  text-transform: uppercase; letter-spacing: .08em;
}
.form-ph .fbody { padding: 22px 18px 8px; }
.form-ph .field { margin: 0 0 16px; }
.form-ph .field label { display: block; font-size: 13px; color: #555; margin-bottom: 6px; }
.form-ph .field .box {
  height: 34px; border: 1px solid #bbb;
  background: repeating-linear-gradient(45deg,#f4f4f4,#f4f4f4 10px,#fafafa 10px,#fafafa 20px);
}
.form-ph .field .box.area { height: 84px; }
.form-ph .more {
  text-align: center; color: #888; font-size: 12px; font-style: italic;
  border-top: 1px dashed #ccc; padding: 14px 0 4px; margin: 4px 0 0;
}
.form-ph .fnote {
  font-size: 12px; color: #555; margin: 0 18px; padding: 12px 0 16px;
  border-top: 1px dotted #bbb;
}
.form-ph .fnote::before { content: "\2197  "; }

/* Zustimmungs-Checkboxen (echtes Divi-Kontaktformular, kontakt.html) */
.form-ph .consent-head { font-size: 13px; color: #555; margin: 4px 0 10px; }
.form-ph .consent { display: flex; gap: 10px; font-size: 13px; color: #444; line-height: 1.4; margin: 0 0 12px; }
.form-ph .consent .cbox { flex: 0 0 auto; width: 16px; height: 16px; border: 1px solid #888; margin-top: 1px; }
.form-ph .consent a { color: #444; }
.form-ph .send { padding: 14px 4px 4px; }

/* ===================================================================
   BLOG-LISTE (WordPress-Beitraege)
   Wie Presse ein Kachel-Grid, aber: Meta = Autor + Datum, und der Klick fuehrt
   INTERN zu einer EV-eigenen Beitragsseite (kein externer Sonderfall wie Presse).
   =================================================================== */
.blog-item { border: 1px solid #111; display: flex; flex-direction: column; }
.blog-item .img-ph { min-height: 160px; border: none; border-bottom: 1px solid #ccc; }
.blog-item .meta { font-size: 12px; color: #666; margin: 14px 16px 6px; letter-spacing: .02em; }
.blog-item .titel { font-size: 18px; line-height: 1.25; margin: 0 16px 10px; }
.blog-item .teaser { font-size: 14px; color: #333; margin: 0 16px 12px; max-width: none; }
.blog-item .more-link { margin: auto 16px 14px; font-size: 13px; border-top: 1px dotted #bbb; padding-top: 10px; }
.blog-item .more-link a { color: #111; }

/* Blog-Beitrag (Detailseite): Kopf-Meta + Interview-Frage/Antwort */
.post-meta { font-size: 13px; color: #666; margin: 0 0 22px; }
.post-lead { font-size: 16px; }
.qa { margin: 0 0 8px; }
.qa h3 { font-size: 17px; text-transform: none; letter-spacing: 0; margin: 22px 0 8px; }

/* „Über uns" · Info-Spalten: jede Einheit (Foto + Text + Button) als EIN umrahmter Block */
.infocol .info-card { border: 1.5px solid #111; padding: 16px; margin-bottom: 24px; }
.infocol .info-card:last-child { margin-bottom: 0; }
.infocol .info-card > * { margin: 0; max-width: none; }
.infocol .info-card > * + * { margin-top: 14px; }
.infocol .info-card h4 { font-size: 15px; text-transform: uppercase; letter-spacing: .02em; }
.infocol .info-card p { font-size: 14px; }
.infocol .info-card .img-ph { min-height: 170px; }