.clw-hero,.clw-hero *{box-sizing:border-box}
/* Full-bleed Hero (volle Viewport-Breite, bricht aus der Elementor-Spalte aus) */
/* Feste Hoehe = Live-RevSlider-Hoehe, damit der -350px-Overlap des Magenta-Panels (8925be8) deckungsgleich sitzt.
   Anker: magentaTop muss Live treffen (Desktop 624px). vh wurde bewusst entfernt (RevSlider ist fix, nicht vh-basiert). */
.clw-hero{position:relative;z-index:1;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);
	height:974px;min-height:974px;overflow:hidden;display:flex;align-items:flex-start;padding-top:235px;
	background-color:#031228}
	/* z-index:1 macht den Hero zum eigenen Stacking-Context -> das Globus-Bild deckt auch den
	   Überlappungsbereich 921–974 über der nachfolgenden grauen Sektion f802b09 (#f9f9f9).
	   Sonst malt f802b09 (DOM-danach) über das Bild und nur das Overlay blieb -> grauer Streifen.
	   Die Karten (z-index:1, DOM-danach) bleiben darüber. */
/* feste px-Höhe statt height:100%: bei absolut positioniertem <img> resolved %-Höhe sonst auf das
   Seitenverhältnis (Bild füllt nur oberen Teil -> grauer Bereich unten). object-fit:cover deckt dann voll. */
.clw-hero__bg{position:absolute;inset:0;width:100%;height:974px!important;object-fit:cover;object-position:center;z-index:0}
/* Overlay: links abdunkeln (Text-Lesbarkeit) + UNTEN abdunkeln, damit die Elementor-Karten
   (8925be8, -350px Overlap) ueber einem lebendigen, dunklen Globus "schweben" wie im Live-RevSlider
   (ersetzt die entfernte sr7-shp-Dunkel-Shape). Rechts NICHT zu hell auswaschen (.28 Floor). */
/* 1:1 Original-RevSlider: GLEICHMÄSSIGE 50%-Dunkelfläche über dem GANZEN Globus
   (sr7-shp = rgba(38,43,62,.5)) -> Globus überall konsistent (links dunkel/Text lesbar,
   rechts/unten leuchtend), KEIN Gradient-Streifen, kein ausgewaschener grauer Boden.
   + dezente Extra-Abdunklung ganz links für den Titel. */
.clw-hero__overlay{position:absolute;inset:0;z-index:1;
	background:linear-gradient(90deg,rgba(3,18,40,.30) 0%,rgba(3,18,40,0) 45%),rgba(38,43,62,.5)}
/* Inner an den ELEMENTOR-CONTENT-Container (Breite 1170px, mobil 15px Gutter) ausrichten
   -> Hero-Text/CTA fluchten mit dem USP-Karten-Container (8925be8, left 135 @1440 / 15 @mobil),
   NICHT mehr mit dem schmaleren Header-Logo (1340er-Wrap). Kunden-Wunsch 2026-06-23:
   "Hero-Text, CTA-Button, USPs-Container auf einer Linie". Live bestätigt Hero-Text ≈ 135. */
.clw-hero__inner{position:relative;z-index:2;width:100%;color:#fff;
	padding:0 max(28px,calc((100vw - 1170px)/2));}
/* Titel = Raleway 700 60px/72 (1:1 Live). Body-Text = POPPINS (Live nutzt Poppins, nicht Raleway). */
.clw-hero__title{font-family:"Raleway",sans-serif;font-size:clamp(2.2rem,4.2vw,60px);line-height:1.2;margin:0 0 16px;font-weight:700;color:#fff}
.clw-hero__title .pink-dot{color:#910048}
.clw-hero__title .law-light{font-weight:300}
/* Beide Absätze identisch: Poppins 16px/600, lh25 (1:1 Live). Reihenfolge via Template (line1/line2). */
.clw-hero__subline,.clw-hero__tagline{font-family:"Poppins",sans-serif;font-size:16px;font-weight:600;line-height:25px;max-width:50ch;margin:0 0 15px;color:#fff;opacity:1}
.clw-hero__eyebrow{font-family:"Poppins",sans-serif;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin:10px 0 20px;opacity:.95}
.clw-hero__cta{display:inline-block;font-family:"Poppins",sans-serif;font-size:13px;font-weight:600;background:#910048;color:#fff;padding:16px 34px}
.clw-hero__cta:hover{background:#73003a;color:#fff}
@media (max-width:991px){
  /* min-height an Live angeglichen: Magenta-Karten-Anker (8925be8) muss mobil top=719 treffen
     (478px ergab nur 573 -> Karten 146px zu hoch). padding-top hebt den Titel auf Live-Niveau. */
  .clw-hero{height:624px;min-height:624px;padding-top:130px}
  .clw-hero__bg{height:624px!important}
  .clw-hero__overlay{background:linear-gradient(180deg,rgba(3,18,40,.30),rgba(3,18,40,.10) 40%),rgba(38,43,62,.55)}
}
/* WEISSER STREIFEN über dem Header (mobil) — Fix 2026-06-23.
   Das Theme reserviert per inline-CSS `body{padding-top:70px}` (@media max-width:767px) Platz für
   seinen alten FIXED-Header. Unser Header ist aber ein transparenter ABSOLUTE-Overlay -> die 70px
   blieben als weißer Streifen sichtbar (per Pixel-Sampling bestätigt: y0–68 = rgb(255,255,255)).
   GESCHEITERTER 1. Versuch (margin-top:-70 am Hero): der Vorfahre #content hat overflow:hidden bei
   top:70 -> der hochgezogene Hero-Teil wurde GEKAPPT, Streifen blieb weiß.
   RICHTIGER Fix: die body-padding auf der Startseite (mobil) direkt entfernen -> #content, Header
   und Hero starten bei y=0, kein Streifen. Scope body.home (andere Seiten behalten ihren Offset).
   Folge: USP-Karten rücken ~70px nach oben, sitzen aber kohärent direkt unter dem Hero. */
@media (max-width:767px){
  body.home{padding-top:0 !important}
}