/* Fonts */
/* ===== Fluid Typography mit Fallback ===== */
:root{
  /* Headline-Skalierung: 1 = Standard, 0.9 = kleiner, 1.1 = größer */
  --scale-h: .95;

  /* Abstände */
  --space-1: clamp(6px, 0.8vw, 12px);
  --space-2: clamp(10px, 1.2vw, 18px);
  --space-3: clamp(16px, 2vw, 28px);
  --space-4: clamp(24px, 3vw, 44px);
  --space-5: clamp(32px, 4vw, 64px);
}

/* Fallback + fluid mit clamp() */
.hero-title,
.hero-title .elementor-heading-title {
  font-size: 50px!important;                                      /* Fallback für alte Browser */
  font-size: calc(clamp(32px, 7vw, 76px) * var(--scale-h))!important;  /* Fluid + skalierbar */
  line-height: 1.05!important;
  letter-spacing: -0.015em!important;
}

/* Keep the homepage hero heading aligned with the mobile H2 scale. */
@media (max-width: 767px) {
  body.home .hero-title,
  body.home .hero-title .elementor-heading-title,
  body.home .hero-title h1 {
    font-size: calc(34px * var(--scale-h)) !important;
  }
}

/* Body */
body {
  font-size: 16px;
  line-height: 1.6!important;
}

.fs-footer,
.fs-footer li{
  font-size: 14px!important;                        /* Fallback */
  font-size: clamp(12px, 0.9vw, 16px)!important;    /* Fluid */
  line-height: 1.6!important;
}

.fs-footer > h4 {
  font-size: 18px;                        /* Fallback */
  font-size: clamp(15px, 1.2vw, 19px);    /* Fluid */
  line-height: 1.6!important;
}

/* H1 */
h1 {
  font-size: 56px;                                        /* Fallback */
  font-size: calc(clamp(28px, 6vw, 56px) * var(--scale-h)); /* Fluid + skalierbar */
  line-height: 1.15;
  margin: 0 0 var(--space-2);
  letter-spacing: -0.01em;
}

h1.product_title {
  font-size: 36px;                                        /* Fallback */
  font-size: calc(clamp(24px, 3.2vw, 36px) * var(--scale-h)); /* Fluid + skalierbar */
  line-height: 1.15;
  margin: 0 0 var(--space-2);
  letter-spacing: -0.005em;
}

/* H2 */
h2 {
  font-size: 42px;                                        /* Fallback */
  font-size: calc(clamp(34px, 3.6vw, 42px) * var(--scale-h)); /* Fluid + skalierbar */
  line-height: 1.4;
  margin: 0 0 var(--space-2);
  letter-spacing: -0.005em;
}

/* H3 */
h3 {
  font-size: 22px;                                        /* Fallback */
  font-size: calc(clamp(20px, 2.2vw, 28px) * var(--scale-h)); /* Fluid + skalierbar */
  line-height: 1.4;
  margin: 0 0 var(--space-2);
}

/* H4 */
h4 {
  font-size: 18px;                                        /* Fallback */
  font-size: calc(clamp(18px, 1.6vw, 22px) * var(--scale-h)); /* Fluid + skalierbar */
  line-height: 1.4;
  margin: 0 0 var(--space-2);
}

/* Absätze & Listen */
p, ul, ol { 
  margin-bottom: var(--space-1); 
}

/* Zusätze */
.small { 
  font-size: 14px;                        /* Fallback */
  font-size: clamp(13px, 0.95vw, 15px);   /* Fluid */
  line-height: 1.55; 
}

/* unter Body (dezent kleiner) */
.text-sm {
  font-size: 16px;                        /* Fallback */
  font-size: clamp(14px, 1.05vw, 17px);   /* Fluid: min 14, meist ~body-1px, max 17 */
  line-height: 1.55;
}

/* noch kleiner (für Meta/Feintext) */
.text-xs {
  font-size: 14px;                        /* Fallback */
  font-size: clamp(12px, 0.9vw, 16px);    /* Fluid: min 12, max 15 */
  line-height: 1.5;
}

/* optional: „Kleingedrucktes“ */
.fineprint {
  font-size: 12px;
  font-size: clamp(11px, 0.8vw, 13px);
  line-height: 1.45;
  letter-spacing: 0.005em;
  opacity: .9;
}

.lead { 
  font-size: 18px;                        /* Fallback */
  font-size: clamp(17px, 1.6vw, 22px);    /* Fluid */
  line-height: 1.55; 
}

.section { 
  padding-block: var(--space-5); 
}

/* ===== Elementor Heading Size Classes → Fluid + Fallback ===== */
/* Reihenfolge: Fallback zuerst, dann clamp() */

.elementor-heading-title.elementor-size-xxl {
  font-size: 48px;
  font-size: calc(clamp(36px, 6vw, 56px) * var(--scale-h));
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0 0 clamp(24px, 3vw, 44px);
}

.elementor-heading-title.elementor-size-xl {
  font-size: 36px;
  font-size: calc(clamp(28px, 3.8vw, 44px) * var(--scale-h));
  line-height: 1.15;
  letter-spacing: -0.005em;
  margin: 0 0 clamp(16px, 2.4vw, 32px);
}

.elementor-heading-title.elementor-size-large {
  font-size: 28px;
  font-size: calc(clamp(22px, 2.6vw, 32px) * var(--scale-h));
  line-height: 1.15;
  margin: 0 0 clamp(12px, 1.8vw, 24px);
}

.elementor-heading-title.elementor-size-medium {
  font-size: 22px;
  font-size: calc(clamp(20px, 2.2vw, 28px) * var(--scale-h));
  line-height: 1.2;
  margin: 0 0 clamp(10px, 1.4vw, 20px);
}

.elementor-heading-title.elementor-size-small {
  font-size: 18px;
  font-size: calc(clamp(18px, 1.6vw, 22px) * var(--scale-h));
  line-height: 1.25;
  margin: 0 0 clamp(8px, 1.2vw, 16px);
}

/* Optional: Standardgröße falls keine Size-Klasse gesetzt ist */
.elementor-heading-title:not([class*="elementor-size-"]) {
  font-size: 24px;
  font-size: calc(clamp(20px, 2.8vw, 30px) * var(--scale-h));
  line-height: 1.2;
  margin: 0 0 clamp(12px, 1.8vw, 24px);
}

/* Bonus: Absatz- und Listenabstände für Elementor-Texteditor */
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
  margin-bottom: clamp(10px, 1.2vw, 10px);
}
