/* Match visual style with Startseite/home.css (dark theme + cyan accent) */
:root{
	--bg:#0a0f1a;
	--panel:#0f1724; /* slightly lighter than bg */
	--accent:#14a6ff;
	--muted:#b0b0b0;
	--text:#e0e0e0;
	--max-width:1100px;
}

*{box-sizing:border-box}
body{
	margin:0;
	font-family: Arial, Helvetica, sans-serif;
	background-color:var(--bg);
	color:var(--text);
}

.container{max-width:var(--max-width);margin:0 auto;padding:24px}

/* Header (matches home.css .nav) */
.site-header{background-color:#111827;padding:12px 0;border-bottom:2px solid var(--accent)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo img{height:90px;display:block}
nav a{color:var(--text);text-decoration:none;font-weight:700;padding:8px 12px;border-radius:6px}
nav a:hover{background-color:var(--accent);color:var(--bg)}

/* Hero */
.hero{padding:28px 0 18px}
.hero-inner{display:flex;gap:24px;align-items:center}
.hero{max-width:900px;margin-left:auto;margin-right:auto;text-align:center}
.hero-text{flex:1;text-align:center}
.hero-text h1{font-size:2.1rem;margin:0 0 12px;font-weight:800;letter-spacing:0.2px}
.lead{color:var(--muted);margin:0 auto 14px;max-width:760px}
/* make hero look like site panels (match 'mission' and founder card) */
.hero{background:var(--panel);border-radius:8px;padding:28px;border:1px solid rgba(255,255,255,0.03);box-shadow:0 6px 18px rgba(2,6,23,0.6)}
/* hero spacing to mission */
.hero{margin-bottom:42px}
/* hero CTA use filled primary */
.hero .btn-primary{background:var(--accent);color:var(--bg);border:none}
.hero .btn-primary:hover{opacity:0.95}

/* Panels and sections */
.mission, .cta, .team-grid .member{background:var(--panel);border-radius:8px;padding:20px}
.mission{margin:20px 0}
.mission h2{margin-top:0}
.values{display:flex;flex-wrap:wrap;gap:16px;list-style:none;padding:0;margin:12px 0;justify-content:center}
.values li{flex:1 1 260px;max-width:280px;background:transparent;padding:12px;border-radius:6px;border:1px solid rgba(255,255,255,0.04);text-align:left}
.values strong{display:block;margin-bottom:6px}

/* Team */

/* Buttons */
.btn{display:inline-block;padding:10px 16px;border-radius:8px;background:transparent;border:1px solid rgba(255,255,255,0.06);color:var(--text);text-decoration:none}
.btn-primary{background:var(--accent);color:var(--bg);border:none}
.btn:hover{opacity:0.95}

.cta{margin:20px 0;text-align:center;max-width:900px;margin-left:auto;margin-right:auto}

/* Center the mission section like the founder section */
.mission{max-width:900px;margin-left:auto;margin-right:auto;text-align:center}
.mission h2{margin-top:0}
.mission p{margin:0 0 12px}

/* Footer similar to home.css .footer */
.site-footer{background-color:#111827;color:var(--muted);text-align:center;padding:20px;margin-top:40px;border-top:2px solid var(--accent)}
.site-footer a{color:var(--accent);text-decoration:none;font-weight:700}

@media (max-width:720px){
	.hero-inner{flex-direction:column;text-align:center}
	.hero-image img{max-width:160px}
	.header-inner{padding:8px}
}

/* Founder card styles */
.founder{text-align:center}
.founder-card{display:block;background:var(--panel);padding:22px;border-radius:10px;border:1px solid rgba(255,255,255,0.03);max-width:900px;margin:0 auto}
.founder-card > h2{display:block;margin:0 0 14px;text-align:center;color:var(--text);font-size:1.25rem;font-weight:700}
.founder-row{display:flex;align-items:flex-start;gap:20px}
.founder-photo{width:110px;height:110px;object-fit:cover;border-radius:12px;border:2px solid rgba(255,255,255,0.05)}
.founder-bio{flex:1;text-align:left}
.founder-name{margin:0;font-size:1.15rem}
.founder-role{margin:4px 0 10px;color:var(--muted);font-weight:600}
.founder-contact{margin-top:12px}
.founder-contact .contact-lines{margin-top:8px;color:var(--muted);font-size:0.95rem}
.founder-contact .contact-lines a{color:var(--accent);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:8px}
.founder-contact .contact-lines a:hover{text-decoration:underline}

/* small icon sizing inside contact links */
.icon{width:18px;height:18px;display:inline-block;vertical-align:middle;fill:none;stroke:var(--accent)}
.icon-mail{margin-right:6px}
.icon-phone{margin-right:6px}

@media (max-width:720px){
	.founder-row{flex-direction:column;align-items:center}
	.founder-photo{margin:0}
	.founder-bio{width:100%;text-align:center}
	.founder-contact{margin-bottom:6px}
}




/* ===== Dark Mode Basis ===== */
body {
  margin: 0;
  font-family: Arial, sans-serif;
  background-color: #0a0f1a;   /* dunkler Hintergrund */
  color: #e0e0e0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ===== Header ===== */
.nav {
  display: grid;
  grid-template-columns: 1fr auto 1fr; /* Logo | Navi | Login */
  align-items: center;
  background-color: #111827;
  padding: 15px 30px;
  border-bottom: 2px solid #14a6ff;
}

/* Logo links */
.brand {
  justify-self: start;
}
.brand img {
  height: 150px;
  display: block;
}

/* Navi mittig */
.links {
  display: flex;
  justify-content: center;
  gap: 20px;
}
.links a {
  color: #e0e0e0;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 12px;
  border-radius: 5px;
}
.links a:hover {
  background-color: #14a6ff;
  color: #0a0f1a;
}

/* Login rechts */
.login {
  justify-self: end;
}
.login a {
  color: #e0e0e0;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 12px;
  border-radius: 5px;
}
.login a:hover {
  background-color: #14a6ff;
  color: #0a0f1a;
}

/* ===== Hauptbereich ===== */
.content {
  flex: 1; /* schiebt Footer nach unten */
  padding: 40px 20px;
  text-align: center;
}

/* ===== Footer ===== */
.footer {
  background-color: #111827;
  color: #b0b0b0;
  text-align: center;
  padding: 20px;
  border-top: 2px solid #14a6ff;
}
.footer-links {
  margin-bottom: 10px;
}
.footer-links a {
  color: #14a6ff;
  margin: 0 10px;
  text-decoration: none;
  font-weight: bold;
}
.footer-links a:hover {
  text-decoration: underline;
}


.model-list {
  list-style: none;
  padding: 0;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.model-list {
  list-style: none;
  padding: 0;
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.model-list li {
  background: linear-gradient(145deg, #1a202e, #141a28);
  color: #f57c00;
  padding: 20px 30px;
  border-radius: 16px;
  font-size: 20px;
  font-weight: 600;
  box-shadow: 4px 4px 12px #0b0f1a, -4px -4px 12px #212936;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  cursor: default;
  user-select: none;
  min-width: 140px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.model-list li:hover {
  color: #ff9c40;
  transform: translateY(-5px);
  box-shadow: 6px 6px 20px #ff9c40aa, -6px -6px 20px #ff9c4088;
}

.model-logo {
  display: block;
  margin-bottom: 9px;
  width: 35px;
  height: auto;
}