/* PROFESSIONAL THEME */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Playfair+Display:wght;700&display=swap');

:root {
  --bg-body: #f5f6f8;
  --bg-surface: #ffffff;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --accent: #1e3a8a;
  --accent-hover: #f59e0b;
  --radius: 4px;
  --shadow: 0 1px 2px rgba(30,58,138,.08);
  --font-head: 'Playfair Display', serif;
  --font-body: 'Inter', sans-serif;
  --max-width: 1200px;
  --gap: 24px;
}

/* Global resets & base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  font-size:clamp(15px,1.05vw,17px);
  line-height:1.6;
  color:var(--text-main);
  background:var(--bg-body);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3{line-height:1.2;font-weight:600;letter-spacing:-.02em}
h1{font-family:var(--font-head);font-size:clamp(2rem,4vw,3.25rem)}
h2{font-size:clamp(1.5rem,3vw,2.25rem)}
h3{font-size:clamp(1.1rem,2vw,1.375rem)}
p{margin-bottom:1em}
section{padding:clamp(3rem,6vw,5rem) 0}

/* Layout containers */
.wrapper{
  width:90%;
  max-width:var(--max-width);
  margin-inline:auto;
}

/* --- Header --- */
.site-header{
  position:sticky;
  top:0;
  z-index:100;
  background:var(--bg-surface);
  box-shadow:var(--shadow);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 0;
}
.logo{font-family:var(--font-head);font-size:1.5rem;font-weight:700;color:var(--accent)}
.main-nav ul{
  list-style:none;
  display:flex;
  gap:clamp(1rem,2vw,2rem);
}
.main-nav a{
  font-weight:500;
  color:var(--text-muted);
  transition:color .2s;
}
.main-nav a:hover{color:var(--accent-hover)}

/* Mobile menu (checkbox hack) */
#menu-toggle{display:none}
.hamburger{
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}
.hamburger span{
  width:24px;height:3px;background:var(--accent);border-radius:2px;transition:all .3s;
}
@media (max-width:768px){
  .hamburger{display:flex}
  .main-nav{
    position:absolute;
    top:100%;left:0;right:0;
    background:var(--bg-surface);
    transform:translateY(-150%);
    transition:transform .35s ease;
    box-shadow:var(--shadow);
  }
  .main-nav ul{flex-direction:column;padding:1.5rem}
  #menu-toggle:checked ~ .main-nav{transform:translateY(0)}
  #menu-toggle:checked ~ .hamburger span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
  #menu-toggle:checked ~ .hamburger span:nth-child(2){opacity:0}
  #menu-toggle:checked ~ .hamburger span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}
}

/* --- Footer --- */
.site-footer{background:var(--text-main);color:#fff;padding:3rem 0 2rem}
.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--gap)}
.footer-section h4{margin-bottom:.75rem;font-weight:600;color:var(--accent-hover)}
.footer-section ul{list-style:none;font-size:.9rem;line-height:2}
.footer-section a:hover{color:var(--accent-hover)}

/* --- Buttons --- */
.btn{
  display:inline-block;
  padding:.9em 1.8em;
  font-weight:500;
  border-radius:var(--radius);
  background:var(--accent);
  color:#fff;
  transition:background .2s,box-shadow .2s;
}
.btn:hover{background:var(--accent-hover);box-shadow:0 4px 12px rgba(30,58,138,.18)}

/* --- Grids --- */
.offers-grid,.partners-grid{
  display:grid;
  gap:var(--gap);
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:900px){.offers-grid,.partners-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.offers-grid,.partners-grid{grid-template-columns:1fr}}

/* --- Job Cards --- */
.job-card{
  background:var(--bg-surface);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:1.5rem 1.25rem;
  display:flex;
  flex-direction:column;
  gap:.75rem;
  transition:transform .25s,box-shadow .25s;
}
.job-card:hover{transform:translateY(-3px);box-shadow:0 4px 14px rgba(30,58,138,.12)}
.job-card h3{font-weight:600;margin-bottom:.25rem}
.job-card .meta{
  font-size:.85rem;
  color:var(--text-muted);
  display:flex;flex-wrap:wrap;gap:.75rem;
}
.job-card .excerpt{margin-top:.25rem;font-size:.92rem;color:var(--text-muted)}

/* --- Partner Links --- */
.partner-link{
  background:var(--bg-surface);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:1.25rem;
  text-align:center;
  transition:transform .25s;
}
.partner-link:hover{transform:translateY(-2px)}
.partner-link img{height:48px;margin:0 auto .5rem}
.partner-link span{font-weight:500;font-size:.9rem;color:var(--text-muted)}

/* --- FAQ Akordeon --- */
details{
  background:var(--bg-surface);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:1rem 1.25rem;
  margin-bottom:.75rem;
}
summary{
  font-weight:600;
  cursor:pointer;
  list-style:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
summary::after{
  content:'+';
  font-size:1.2rem;
  color:var(--accent);
  transition:transform .2s;
}
details[open] summary::after{transform:rotate(45deg)}
details > *:not(summary){margin-top:1rem}

/* --- Show-More Partners (Checkbox Hack) --- */
.partners-wrapper .partners-hidden{display:none}
.partners-wrapper .show-more-checkbox{display:none}
.partners-wrapper .show-more-checkbox:checked ~ .partners-hidden{display:grid}
.partners-wrapper .show-more-checkbox:checked ~ .show-more-container{display:none}
.show-more-container{text-align:center;margin-top:1.5rem}
.show-more-container label.btn{cursor:pointer}

/* --- Live Ticker --- */
.ticker{
  background:var(--accent);
  color:#fff;
  font-size:.8rem;
  font-weight:500;
  padding:.35rem 0;
  overflow:hidden;
  white-space:nowrap;
}
.ticker span{
  display:inline-block;
  padding-left:100%;
  animation:ticker 25s linear infinite;
}
@keyframes ticker{
  0%{transform:translateX(0)}
  100%{transform:translateX(-100%)}
}

/* --- Mini Chart Decoration (CSS only) --- */
.mini-chart{
  position:relative;
  height:40px;
  margin-top:.75rem;
  overflow:hidden;
}
.mini-chart::before,
.mini-chart::after{
  content:'';
  position:absolute;
  left:0;right:0;
  height:2px;
  background:var(--accent-hover);
}
.mini-chart::before{top:30%;transform:translateY(-50%)}
.mini-chart::after{top:70%;transform:translateY(-50%)}
/* simple rising line */
.mini-chart i{
  position:absolute;
  top:0;left:0;right:0;bottom:0;
  border-bottom:2px solid var(--accent-hover);
  transform:rotate(-2deg);
  transform-origin:left;
}