:root{
  --bg:#ffffff;
  --fg:#111827;
  --muted:#6b7280;
  --line:#e5e7eb;
  --card:#f9fafb;
  --accent:#c2410c; /* gedämpftes Orange */
  --accent2:#0f172a; /* dunkles Blau/Anthrazit */
  --max:1100px;
  --r:14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--fg);
  background:var(--bg);
  line-height:1.55;
}
a{color:inherit}
a:hover{opacity:.9}
.container{max-width:var(--max); margin:0 auto; padding:0 18px;}
.topbar{
  border-bottom:1px solid var(--line);
  position:sticky; top:0; background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(10px);
  z-index:20;
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 0;
  gap:14px;
}
.brand{
  display:flex; align-items:center; gap:10px; text-decoration:none;
  font-weight:750; letter-spacing:.2px;
}
.logo{
  width:34px; height:34px; border-radius:10px;
  background:linear-gradient(135deg,var(--accent2),#1f2937);
  display:grid; place-items:center; color:white; font-size:14px; font-weight:800;
}
.navlinks{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.navlinks a{ text-decoration:none; padding:8px 10px; border-radius:10px; }
.navlinks a[aria-current="page"]{ background:var(--card); border:1px solid var(--line); }
.actions{display:flex; gap:10px; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:12px; border:1px solid var(--line);
  text-decoration:none; font-weight:650;
}
.btn.primary{ background:var(--accent2); color:white; border-color:transparent;}
.btn.accent{ background:var(--accent); color:white; border-color:transparent;}
.btn.ghost{ background:transparent;}
.hero{ padding:54px 0 26px; }
.kicker{color:var(--muted); font-weight:650;}
h1{font-size:clamp(30px,3.8vw,48px); line-height:1.08; margin:10px 0 12px;}
.lead{font-size:clamp(16px,2vw,19px); color:#1f2937; max-width:70ch;}
.hero-ctas{display:flex; gap:10px; margin-top:18px; flex-wrap:wrap}
.note{color:var(--muted); margin-top:12px; font-size:14px}
.grid{ display:grid; gap:14px; }
.grid.cols2{grid-template-columns:repeat(2,minmax(0,1fr));}
  .navlinks{display:none;}
}
.section{padding:26px 0;}
.section h2{font-size:22px; margin:0 0 10px;}
.section p{margin:10px 0; color:#111827;}
.muted{color:var(--muted)}
.card{
  border:1px solid var(--line);
  background:var(--card);
  border-radius:var(--r);
  padding:16px;
}
.card h3{margin:0 0 8px; font-size:16px;}
.card p{margin:0 0 10px; color:var(--muted); font-size:14px;}
.card .btn{margin-top:8px;}
.badge{
  display:inline-flex; gap:8px; align-items:center;
  font-size:12px; color:var(--muted);
  border:1px solid var(--line); padding:6px 10px; border-radius:999px;
  background:white;
}
.hr{border-top:1px solid var(--line); margin:18px 0;}
.footer{ border-top:1px solid var(--line); padding:26px 0 18px; margin-top:34px; }
.footergrid{
  display:grid; gap:16px;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:900px){ .footergrid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ .footergrid{grid-template-columns:1fr;} }
.footer h4{margin:0 0 8px; font-size:14px;}
.footer a{display:block; text-decoration:none; color:var(--muted); padding:4px 0; font-size:14px;}
.footer a:hover{color:#111827}
.smallprint{margin-top:16px; color:var(--muted); font-size:13px;}
.table{
  width:100%;
  border-collapse:collapse;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.table th,.table td{
  padding:12px 12px;
  border-bottom:1px solid var(--line);
  text-align:left;
  font-size:14px;
}
.table th{background:#f3f4f6; font-weight:700;}
.table tr:last-child td{border-bottom:none;}

/* --- Hero split (Startseite) --- */
.hero-split{
  display:grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap:24px;
  align-items:center;
  padding:54px 0 26px;
}
.hero-split .hero-copy{padding-right:6px;}
.hero-split .hero-media{
  position:relative;
}
.hero-split .hero-media img{
  width:100%;
  height:auto;
  display:block;
  border-radius:var(--r);
  border:1px solid var(--line);
  background:white;
}
.hero-split .hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:var(--r);
  pointer-events:none;
  background:linear-gradient(120deg, rgba(11,59,161,0.10), rgba(255,255,255,0));
}
@media (max-width:900px){
  .hero-split{grid-template-columns: 1fr; padding:38px 0 16px;}
  .hero-split .hero-copy{padding-right:0;}
}


/* ------------------------------------------------------------------
   Home: Feature split block (image left, text right)
------------------------------------------------------------------ */
.feature-split{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap:16px;
  align-items:stretch;
  margin-top:10px;
}
.feature-split .media{
  border-radius: var(--r);
  overflow:hidden;
  border:1px solid var(--line);
  background:#fff;
}
.feature-split img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.feature-split .content{
  border:1px solid var(--line);
  background:var(--card);
  border-radius:var(--r);
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.feature-split .content h2{ margin:0 0 8px; font-size:22px;}
.feature-split .content p{ margin:0 0 12px; color:var(--muted);}
@media (max-width:900px){
  .feature-split{ grid-template-columns:1fr; }
  .feature-split .content{ order:-1; }
}
/* ------------------------------------------------------------------
   Color hierarchy (Primary = Campus Blue)
------------------------------------------------------------------ */
a { color: var(--primary); }
a:hover { text-decoration: underline; }

.btn.accent {
  background: var(--primary);
  color: var(--primary-contrast);
  border-color: var(--primary);
}
.btn.accent:hover {
  background: #0a3492;
  border-color: #0a3492;
}

.badge {
  background: var(--primary-soft);
  color: var(--primary);
  border: 1px solid rgba(11,59,161,.2);
}

header, footer {
  background: #0f172a;
  color: #e5e7eb;
}

header a, footer a {
  color: #e5e7eb;
}
header a:hover, footer a:hover {
  color: #ffffff;
}

/* Signal usage (sparingly) */
.signal { color: var(--signal); }
.signal-border { border-color: var(--signal); }


/* Logo sizing */
.site-logo img {
  height: 42px;
  width: auto;
  display: block;
}
@media (max-width: 600px) {
  .site-logo img { height: 36px; }
}

/* ------------------------------------------------------------------
   Header: Academy brand (text + mini signet)
------------------------------------------------------------------ */
header, .header {
  background: linear-gradient(135deg, #0b3ba1 0%, #082b66 100%);
  color: #ffffff;
}

header a, .header a { color:#ffffff; }
header a:hover, .header a:hover { color:#ffffff; opacity:.95; }

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.brand .academy-mark{
  width:44px;
  height:20px;
  display:block;
  flex:0 0 auto;
}

.brand-stack{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}

.brand-title{
  font-weight:700;
  letter-spacing:-0.01em;
  font-size:14px;
  white-space:nowrap;
}

.brand-sub{
  font-weight:500;
  opacity:.9;
  font-size:12px;
  white-space:nowrap;
}

@media (max-width: 600px){
  .brand-title{ font-size:13px; }
  .brand-sub{ display:none; } /* Mobile ruhiger */
}

/* Force header background */
header{
  background: linear-gradient(135deg, #0b3ba1 0%, #082b66 100%) !important;
  color:#fff !important;
}
header *{ color: inherit; }

/* Remove any brand separator dots */
.brand .dot, .brand .sep{ display:none !important; }
.brand::before, .brand::after{ content:none !important; }
.brand-stack::before, .brand-stack::after{ content:none !important; }

/* Header nav readability */
header nav a{
  color: rgba(255,255,255,.92) !important;
  font-weight: 500;
}
header nav a:hover{
  color: #ffffff !important;
  text-decoration: underline;
  text-underline-offset: 6px;
}

/* --- Homepage Content Sections (injected) --- */
.home-why, .home-audience, .home-approach { padding: 56px 0; }
.home-why .container, .home-audience .container, .home-approach .container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

.bullets { margin: 18px 0 0; padding-left: 18px; }
.bullets li { margin: 8px 0; }

.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 18px; }
.card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.10); border-radius: 14px; padding: 18px; }
.hint { margin-top: 16px; opacity: 0.9; }

@media (max-width: 900px) {
  .grid-3 { grid-template-columns: 1fr; }
}

/* --- Home content helpers --- */
.bullets { margin: 14px 0 0; padding-left: 18px; }
.bullets li { margin: 8px 0; }

.grid.cols3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) {
  .grid.cols3 { grid-template-columns: 1fr; }
}

/* --- Card layout: align buttons to bottom --- */
.grid .card { display: flex; flex-direction: column; }
.grid .card .btn { margin-top: auto; align-self: flex-start; }
.grid .card p { margin-bottom: 12px; }

/* --- Card look: subtle panel --- */
.card {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  padding: 18px;
}

/* --- Target group cards: clear panel look --- */
.grid.cols3 .card {
  display: flex;
  flex-direction: column;
  padding: 22px 22px 24px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 6px 18px rgba(0,0,0,0.04);
}

.grid.cols3 .card h3 {
  margin-bottom: 10px;
  font-size: 1.05rem;
}

.grid.cols3 .card p {
  margin-bottom: 18px;
  color: #4a5568; /* ruhiges Grau */
  line-height: 1.5;
}

.grid.cols3 .card .btn {
  margin-top: auto;
  padding: 10px 18px;
  font-weight: 600;
}

.grid.cols3 .card .btn:hover {
  transform: translateY(-1px);
}

/* --- Offer cards: same visual logic as target groups --- */
.section h2 + .grid.cols3 .card {
  display: flex;
  flex-direction: column;
}

.section h2 + .grid.cols3 .card .btn {
  margin-top: auto;
}

/* --- Footer CTA spacing --- */
section.section:last-of-type {
  padding-bottom: 72px;
}

/* --- Campus CI Colors --- */
:root {
  --campus-blue: #1e5aa8;
  --campus-navy: #0f2f4a;
  --campus-navy-hover: #163f63;
  --campus-blue-soft: #eaf2fb;
}

/* --- Buttons: replace black with campus navy --- */
.btn:not(.accent) {
  background: var(--campus-navy);
  color: #ffffff;
  border: none;
}

.btn:not(.accent):hover {
  background: var(--campus-navy-hover);
}

/* --- Footer: align with campus CI --- */
footer {
  background: var(--campus-navy);
  color: #dbe7f3;
}

footer a {
  color: #ffffff;
}

footer a:hover {
  color: #a9c9ec;
}

/* --- Hover safety --- */
a:hover {
  opacity: 0.9;
}

/* --- Hero brand anchor --- */
.hero-brand {
  margin-top: 8px;
  font-size: 1rem;
  font-weight: 600;
  color: #ffffff;
  opacity: 0.9;
}

/* --- Campus CI Colors (refined) --- */
:root {
  --campus-blue: #0b3ba1;
  --campus-secondary: #274f7d;
  --campus-secondary-hover: #31669e;
  --campus-blue-soft: #eef4fb;
}

/* --- Buttons refined --- */
.btn:not(.accent) {
  background: var(--campus-secondary);
  color: #ffffff;
}

.btn:not(.accent):hover {
  background: var(--campus-secondary-hover);
}

/* --- Footer refined --- */
footer {
  background: var(--campus-secondary);
  color: #e6eef6;
}

footer a {
  color: #ffffff;
}

footer a:hover {
  color: #d0e2f5;
}

/* --- Hero CI Logo --- */
.hero-logo {
  margin-top: 12px;
}

.hero-logo img {
  max-width: 220px;
  height: auto;
  opacity: 0.95;
}

/* --- Footer text contrast fix --- */
footer {
  color: #e9f1f9; /* helles Blau-Weiß, gut lesbar */
}

footer p,
footer li,
footer span {
  color: #e9f1f9;
}

footer .muted,
footer small {
  color: #cfe0f1; /* bewusst heller als vorheriges Grau */
}

/* --- Frame: header + footer same CI background --- */
header, .header,
footer.footer {
  background: var(--campus-secondary) !important;
  color: #ffffff !important;
}

/* --- Footer contrast: override muted-in-footer --- */
.footer, .footer * {
  color: #eaf2fb !important;
}

.footer a {
  color: #ffffff !important;
}

.footer a:hover {
  color: #d6e8fb !important;
  text-decoration: underline;
}

/* smallprint + muted inside footer slightly dimmer but readable */
.footer .smallprint,
.footer .muted,
.footer small {
  color: #cfe2f7 !important;
}

/* --- Frame reset: header + footer = campus blue --- */
header, .header,
footer.footer {
  background: var(--campus-blue) !important;
  color: #ffffff !important;
}

/* --- Footer text on campus blue --- */
.footer p,
.footer li,
.footer span,
.footer .smallprint {
  color: #e5ecf4 !important;
}

.footer a {
  color: #ffffff !important;
}

.footer a:hover {
  color: #cfe2f7 !important;
  text-decoration: underline;
}

/* --- NAV visibility fix (force readable on campus blue) --- */
header nav, header .navlinks {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

header nav a, header .navlinks a {
  color: #ffffff !important;
}

header nav a:hover, header .navlinks a:hover {
  color: #ffffff !important;
  opacity: .95;
}

header .navlinks a[aria-current="page"],
header nav a[aria-current="page"] {
  background: rgba(255,255,255,0.16) !important;
  border: 1px solid rgba(255,255,255,0.22) !important;
}

header { z-index: 1000; }

/* --- TMS embed container (prepared) --- */
.tms-embed{
  margin-top: 18px;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 16px;
  background: rgba(255,255,255,0.06);
  padding: 14px;
}
