@charset "utf-8";
/* elektrokurse – landingpages (final) */

*{box-sizing:border-box}
html,body{height:100%}

body{
  margin:0;
  font-family:"Times New Roman", Times, serif;
  background:#0b1220;
  color:#ffffff;
  line-height:1.8; /* NEU: Zeilenabstand überall */
}

a{color:#8bb7ff;text-decoration:none}
a:hover{text-decoration:underline}

.wrap{max-width:1600px;margin:0 auto;padding:24px}

.card{
  background:#121b2f;
  border:1px solid #213055;
  border-radius:16px;
  padding:18px;
  margin:14px 0;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  overflow-x:auto;
  overflow-y:hidden;
}

/* Typografie / Abstände (NEU für bessere Lesbarkeit) */
h1{line-height:1.15}
h2{line-height:1.2}
h3{line-height:1.25}
h1,h2,h3{margin:0 0 10px 0}

p{margin:0 0 18px 0}
ul,ol{margin:0 0 18px 24px}
li{margin:10px 0}
p, li { line-height:1.85; }

.muted{color:rgba(255,255,255,.72)}

input,button,select,textarea{
  font-family:"Times New Roman", Times, serif;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #2a3b66;
  background:#0d1730;
  color:#ffffff;
}
button{cursor:pointer}
textarea{resize:vertical}

.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:700px){.grid{grid-template-columns:1fr}}

/* Kontaktformular: Labels leicht einrücken */
.card form label{
  display:inline-block;
  padding-left:16px;
  margin-bottom:6px;
}

.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.btn{
  display:inline-block;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #2a3b66;
  background:#0d1730;
  color:#ffffff;
  text-decoration:none;
}
.btn:hover{filter:brightness(1.1);text-decoration:none}

/* Header */
.siteheader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.head-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:56px;height:auto;display:block}
.brandtext{display:flex;flex-direction:column;line-height:1.05}
.brandname{font-size:20px;letter-spacing:.4px}
.brandslogan{font-size:14px;color:rgba(255,255,255,.8)}

.topnav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.topnav a{
  display:inline-block;
  padding:6px 10px;
  border-radius:10px;
  border:1px solid #213055;
  text-decoration:none;
}
.topnav a:hover{filter:brightness(1.1);text-decoration:none}

.where{font-size:14px;color:rgba(255,255,255,.8)}
.where-strong{color:#ffffff}

.head-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

.iconlink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;height:42px;
  border-radius:12px;
  border:1px solid #213055;
}
.iconlink:hover{filter:brightness(1.1);text-decoration:none}

.phone{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:12px;
  border:1px solid #213055;
  color:rgba(255,255,255,.9);
}

.siteheader svg{width:22px;height:22px;fill:currentColor}

/* Footer */
.sitefooter{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-top:18px;
}
.footnav{display:flex;gap:12px;flex-wrap:wrap}
.footnav a{
  padding:6px 10px;
  border-radius:10px;
  border:1px solid #213055;
}
.footnav a:hover{filter:brightness(1.1);text-decoration:none}
.footmeta{color:rgba(255,255,255,.65);font-size:14px}