/* fonts.css */

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter/Inter-VariableFont_opsz,wght.ttf') format('truetype');
}

/* Basis Schrift und Farben - inkl. Bootstrap Textklassen */
body, p, .lead, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Inter', sans-serif;
  font-weight: 300;
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  line-height: 1.6;
  letter-spacing: -0.015rem;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  letter-spacing: -0.035em;
}


/* Überschriften - inkl. Bootstrap Klassen */
h1, .h1 {
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.2;
  margin-bottom: 0.5em;
}

h2, .h2 {
  font-weight: 700;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.2;
  margin-bottom: 0.5em;
}

h3, .h3 {
  font-weight: 700;
  font-size: clamp(1.25rem, 3vw, 2rem);
  line-height: 1.2;
  margin-bottom: 0.5em;
}

/* Fließtext & Lead */
p {
  margin-bottom: 1em;
}

.lead {
  font-size: clamp(1.125rem, 1.8vw, 2rem);
  font-weight: 500;
}

/* Links */
a, a:visited {
  text-decoration: none;
  color: #000;
}

a:hover, a:focus {
  color: #3095aa;
  text-decoration: none;
}

.trust-text a {
  color: #fff;
}


/* --- Neuer Modifier für Schriftgrößen --- */
/* tpsz-5 = Basis-Schriftgröße aus body */
/* 1-4 verkleinert, 6-10 vergrößert */

/* Wichtig: !important, damit Bootstrap Überschreibungen sicher überschrieben werden */

.tpsz-1 {
  font-size: clamp(0.6rem, 1vw, 0.75rem) !important;
}
.tpsz-2 {
  font-size: clamp(0.75rem, 1.1vw, 0.85rem) !important;
}
.tpsz-3 {
  font-size: clamp(0.85rem, 1.3vw, 0.95rem) !important;
}
.tpsz-4 {
  font-size: clamp(0.95rem, 1.4vw, 1.05rem) !important;
}
.tpsz-5 {
  font-size: clamp(1rem, 1.5vw, 1.125rem) !important; /* Basisgröße */
}
.tpsz-6 {
  font-size: clamp(1.1rem, 1.7vw, 1.25rem) !important;
}
.tpsz-7 {
  font-size: clamp(1.25rem, 2vw, 1.4rem) !important;
}
.tpsz-8 {
  font-size: clamp(1.4rem, 2.3vw, 1.6rem) !important;
}
.tpsz-9 {
  font-size: clamp(1.6rem, 2.6vw, 1.85rem) !important;
}
.tpsz-10 {
  font-size: clamp(1.8rem, 3vw, 2.1rem) !important;
}

.tpsz-11 {
  font-size: clamp(2rem, 3vw, 3rem) !important;
}

.tpsz-navbar {
  font-size: 0.95rem !important; /* Standard für große Screens */
}

@media (max-width: 1024px) {
  .tpsz-navbar {
    font-size: 1.2rem !important; /* größer für alles ≤ 1024px */
  }
}



/* Line-height Modifier: tplh-1 bis tplh-5 */
/* 1 = sehr eng, 3 = Basis, 5 = sehr luftig */
/* Auch hier !important für höhere Spezifität */

.tplh-1 {
  line-height: 1.1 !important;
}

.tplh-2 {
  line-height: 1.3 !important;
}

.tplh-3 {
  line-height: 1.6 !important; /* Basis (wie body) */
}

.tplh-4 {
  line-height: 1.8 !important;
}

.tplh-5 {
  line-height: 2.0 !important;
}

/* Font-weight Modifier: tpwd-1 bis tpwd-6 */
/* 1 = extra light, 6 = extra bold */
/* !important für Bootstrap-Überschreibung */
.tpwd-0-5 {
  font-weight: 100 !important;
}

.tpwd-1 {
  font-weight: 200 !important;
}

.tpwd-2 {
  font-weight: 300 !important; /* entspricht oft normal/light */
}

.tpwd-2-5 {
  font-weight: 350 !important; /* entspricht oft normal/light */
}

.tpwd-3 {
  font-weight: 400 !important; /* normal */
}

.tpwd-4 {
  font-weight: 500 !important; /* medium */
}

.tpwd-5 {
  font-weight: 600 !important; /* semi-bold */
}

.tpwd-6 {
  font-weight: 700 !important; /* bold */
}


.tpcol-1  { color: #000000 !important; } /* Schwarz */
.tpcol-2  { color: #1a1a1a !important; }
.tpcol-3  { color: #333333 !important; }
.tpcol-4  { color: #4d4d4d !important; }
.tpcol-5  { color: #666666 !important; }
.tpcol-6  { color: #808080 !important; }
.tpcol-7  { color: #999999 !important; }
.tpcol-8  { color: #b3b3b3 !important; }
.tpcol-9  { color: #cccccc !important; }
.tpcol-10 { color: #e6e6e6 !important; } /* sehr helles Grau */

/* Optional: Falls Bootstrap noch Styles mit höherer Spezifität nutzt, kannst du das hier ergänzen */
/*
body p, 
body .lead, 
body h1, 
body h2, 
body h3, 
body a {
  font-family: 'Inter', sans-serif !important;
}
*/