@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap');

/* =====================================================
   Datenschutz – exakt Clean/Professional 2.0 Basis
   - Inter
   - Background #fff
   - Typo: #111 / #555 wie Konfigurator
   - Header Schatten kill (kommt aus global.css)
===================================================== */

/* ---------- Basis wie Konfigurator ---------- */
html{
  background: #fff !important;
}

html, body{
  margin: 0;
  padding: 0;
  overflow-x: hidden !important;
  background: #fff !important;
}

body{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background-color: #fff !important;
  color: #111;               /* <- exakt wie Konfigurator */
  text-align: initial;
}

/* Platz für deine fixed Navbar */
main{
  padding-top: 80px !important;
}

/* ---------- HARD KILL: Header-Schatten (global.css) ---------- */
/* In global.css hat .navbar einen box-shadow. Den killen wir hier. */
header,
.navbar{
  box-shadow: none !important;
  filter: none !important;
}

/* falls irgendwo Schatten über Unterelemente reinkommt */
.navbar *{
  box-shadow: none !important;
  filter: none !important;
}

/* falls Schatten als Pseudo-Element gebaut wird */
header::before, header::after,
.navbar::before, .navbar::after{
  content: none !important;
  display: none !important;
  box-shadow: none !important;
}

/* ---------- Datenschutz Layout (clean + kantig) ---------- */
.datenschutz-main{
  max-width: 980px;
  margin: 28px auto;
  padding: 0 1.5rem 5rem;   /* gleiche Innenkante wie 2.0 (1.5rem) */
  background: #fff !important;
}

/* Überschriften: wie 2.0 h2, h1 bleibt sichtbar (Datenschutz braucht sie) */
.datenschutz-header{
  margin: 0 0 2rem;
  text-align: left;
}

.datenschutz-header h1{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  color: #111;
  margin: 0 0 0.75rem;
  text-align: left;
  letter-spacing: 0.2px;
  text-transform: none; /* clean, wie 2.0 */
}

.datenschutz-header p{
  font-size: 0.95rem;
  line-height: 1.6;
  color: #555;            /* <- exakt wie Konfigurator */
  font-weight: 400;
  margin: 0;
}

/* Sections */
.datenschutz-section{
  margin: 0 0 2.2rem;
  padding: 0;
}

/* h2 exakt wie Konfigurator */
.datenschutz-section h2{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  color: #111;
  margin: 0 0 0.75rem;
  text-align: left;
  letter-spacing: 0.2px;
}

/* Fließtext exakt wie Konfigurator */
.datenschutz-section p{
  font-size: 0.95rem;
  line-height: 1.6;
  color: #555;
  font-weight: 400;
  margin: 0 0 0.9rem;
}

/* Listen clean */
.datenschutz-section ul{
  margin: 0.6rem 0 1.1rem 1.1rem;
  padding-left: 1.1rem;
}

.datenschutz-section li{
  font-size: 0.95rem;
  line-height: 1.6;
  color: #555;
  margin: 0 0 0.4rem;
}

/* Links: clean wie 2.0 (du wolltest Schriftfarben so lassen -> hier neutral) */
.datenschutz-section a{
  color: #111;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.datenschutz-section a:hover{
  color: #000;
}

/* Wenn du h3/h4 im Datenschutz nutzt: du wolltest die Farben beibehalten.
   (Falls du die Goldfarben NICHT mehr willst, sag’s – dann mach ich sie #111/#555 wie 2.0.) */
.datenschutz-section h3,
.datenschutz-section h4{
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 500;
  color: #a67c52; /* <- bleibt wie dein vereinbarter Accent */
}

.datenschutz-section h3{
  font-size: 0.95rem;
  margin: 1.2rem 0 0.5rem;
}

.datenschutz-section h4{
  font-size: 0.9rem;
  margin: 1rem 0 0.45rem;
}

/* Optional: dezente Trenner ohne Schatten, kantig */
.datenschutz-section article + article{
  margin-top: 1.2rem;
  padding-top: 1.2rem;
  border-top: 1px solid #e5e5e5;
}

/* Mobile: wie 2.0 (Innenkante bleibt 12px-ish) */
@media (max-width: 768px){
  main{ padding-top: 70px !important; }

  .datenschutz-main{
    margin: 0 auto;
    padding: 0 12px 4rem;
  }
}
