@charset "UTF-8";
/* grossmann · base.scss → base.css. Globale Basis: Bühne/Body, Typo, Utilities,
 * Eyebrow-Chip, Buttons. Reihenfolge-kritisch (Token→Base→…, inc/enqueue.php).
 * Keine Breakpoints hier → kein @use 'breakpoints' nötig. */
/* Bühne / Body-Grundlayout */
body, #page, .site, #content, .site-content {
  background: var(--cream) !important;
  color: var(--text);
  font-family: var(--f-body);
}

/* overflow-x:clip statt hidden — hidden würde overflow-y auf auto zwingen → der Body
   wird Scroll-Container → position:sticky (Header) bricht. clip klippt horizontal
   OHNE Scroll-Container (Tobi 2026-05-31). */
html {
  overflow-x: clip;
}

body {
  margin: 0; /* Browser-Default 8px raus (Tobi 2026-05-30) */
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  line-height: 1.55;
}

/* Elementor-Wrapper neutralisieren (full-bleed). .entry-content NICHT hier — der
   Blog-Artikel regelt sein eigenes Padding (Tobi 2026-05-31). */
.elementor,
.e-con-boxed {
  max-width: none !important;
  padding: 0 !important;
}

/* ALLE gm-Sections full-width — generisch via attribute-selector
 * (--partners/--counter/--cards/--linc/--avgs/--about/--insights/--reviews/
 *  --kontakt/--friends/--steps/--flyer/--cta/--linc-detail …). */
.e-con.section, .e-con.hero, .e-con.nav-bar, .e-con.footer,
.e-con.kontakt-video, .e-con.txtflow-sec, .e-con.colwrap-sec,
.e-con.cta-banner, .e-con.avgs-bn,
.e-con[class*=section--] {
  width: 100% !important;
}

.e-con.wrap {
  display: block !important;
  width: 100%;
  max-width: var(--maxw) !important;
  margin-inline: auto !important;
  /* Padding = native Elementor-Section-Einstellung (Seeder gm_apply_padding). */
}

.e-con.section {
  display: block !important;
  position: relative;
}

/* Section-Hintergründe NICHT per CSS, sondern via Elementor background_color
 * (Seeder gm_apply_bg) → im Style-Tab editierbar. Referenz-Tokens:
 *   section--cream #F6F4EE · white #FFFFFF · pink-soft #FAE0EA · teal-soft #DCEFEC */
/* Typography — Manrope Display + Body */
h1.elementor-heading-title,
h2.elementor-heading-title,
h3.elementor-heading-title,
h4.elementor-heading-title {
  font-family: var(--f-display) !important; /* = Manrope Sans */
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  line-height: 1.12;
  color: var(--ink) !important;
}

/* große Headlines fett (v2-Look) */
h1.elementor-heading-title {
  font-weight: 800 !important;
}

h1.elementor-heading-title {
  font-size: clamp(2.4rem, 1.6rem + 3vw, 4.4rem) !important;
  line-height: 1.02 !important;
}

/* ALLE h2 einheitlich = s-head__title-Look (Tobi 2026-06-12): selbe Schrift/Größe/Schnitt. */
h2.elementor-heading-title {
  font-weight: 700 !important;
  font-size: clamp(1.7rem, 1rem + 1.8vw, 2.4rem) !important;
  line-height: 1.12 !important;
  overflow-wrap: normal; /* nur an Whitespace umbrechen, keine Auto-Hyphens mitten im Wort */
  word-break: normal;
  hyphens: manual;
}

h3.elementor-heading-title {
  font-size: clamp(1.4rem, 1.1rem + 1.1vw, 2rem) !important;
  line-height: 1.15 !important;
}

h4.elementor-heading-title {
  font-size: 1.2rem !important;
  line-height: 1.2 !important;
}

p, .elementor-text-editor p {
  text-wrap: pretty;
}

.lead, .lead p {
  color: var(--muted) !important;
  font-size: 1.185rem;
  line-height: 1.65;
  font-family: var(--f-body);
}

.u-pink {
  color: var(--pink) !important;
}

.u-teal {
  color: var(--teal) !important;
}

.script .elementor-heading-title, .script {
  font-family: var(--f-script) !important;
  font-weight: 600;
  color: var(--pink);
  font-size: 1.2rem;
  font-style: normal;
}

::selection {
  background: var(--pink);
  color: #fff;
}

:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Eyebrow-Chip (Editorial Kicker) */
.elementor-element.chip {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  width: fit-content;
  align-self: flex-start;
  background: none !important;
  box-shadow: 0 0 0 0 transparent !important;
  color: var(--ink) !important;
  font-family: var(--f-body) !important;
  font-size: 0.865rem !important;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0 !important;
  border-radius: 0 !important;
}
.elementor-element.chip .elementor-heading-title {
  font-family: var(--f-body) !important;
  font-weight: 700; /* etwas dicker (v2-Referenz) */
  letter-spacing: 0.16em;
}
.elementor-element.chip {
  /* Strich-Eyebrow überall weg (Tobi „das hat mittlerweile jedes design") — nur der Strich. */
}
.elementor-element.chip::before {
  display: none !important;
}

/* Modifier bewusst OHNE .elementor-element-Präfix (Original-Spezifität bewahren). */
.chip.chip--pink {
  color: var(--text) !important;
} /* Section-Eyebrow = Blau-Grau (Tobi 2026-05-30) */
.chip.chip--soft {
  color: var(--pink-deep) !important;
} /* p-card-Kategorie bleibt pink */
.chip.chip--pink::before, .chip.chip--soft::before {
  background: var(--pink);
}

.chip.chip--light {
  color: var(--ink) !important;
}

/* Buttons */
.elementor-element.btn .elementor-button-wrapper {
  width: fit-content;
}
.elementor-element.btn .elementor-button {
  display: inline-flex !important;
  align-items: center;
  gap: 0.6em;
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.02em;
  padding: 0.85em 1.4em !important;
  border-radius: var(--r-pill) !important;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease;
}

.elementor-element.btn--pink .elementor-button {
  background: var(--pink) !important;
  color: #fff !important;
  box-shadow: 0 4px 16px -4px rgba(220, 69, 132, 0.45);
}
.elementor-element.btn--pink .elementor-button:hover {
  background: var(--pink-deep) !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px -6px rgba(220, 69, 132, 0.55);
}

.elementor-element.btn--ghost .elementor-button {
  background: transparent !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink);
  box-shadow: none;
}
.elementor-element.btn--ghost .elementor-button:hover {
  background: var(--ink) !important;
  color: #fff !important;
}