/* Sina Bachmann, Gestaltung fuer WordPress mit Elementor.

   ERZEUGT VON tools/wordpress.py, HIER NICHTS AENDERN.
   Geaendert wird site/css/style.css, danach das Skript erneut aufrufen.

   Diese Datei enthaelt die vollstaendige Gestaltung des Entwurfs. Regeln,
   die auf blanke Elemente wirken, also auf section, ul, img oder h2, sind
   auf unsere importierten Abschnitte eingegrenzt und stehen deshalb als

     .elementor-widget-html section{...}

   statt als section{...}. Damit gelten sie dort, wo unser Entwurf steht,
   und nirgends sonst: nicht in der Kopfzeile, nicht in der Fusszeile und
   nicht in einem Baustein, den Sina spaeter selbst setzt.

   Frueher fielen diese Regeln ganz weg, in der Annahme, die globalen
   Einstellungen von Elementor koennten sie ersetzen. Das stimmt nicht:
   img{max-width:100%} oder section{position:relative} lassen sich dort
   gar nicht eintragen, und ohne sie stehen Bilder und Abstaende falsch.

   Die Farbwerte in :root bleiben unveraendert, weil die Klassen darauf
   aufbauen. Sie werden zusaetzlich als globale Farben in Elementor
   hinterlegt, damit Sina sie im Baukasten sieht.
*/

/* Sisterhood, die Schreibschrift ihrer bestehenden Seite.
   Die Datei stammt aus ihrer Mediathek und ist von woff nach woff2
   umgewandelt, das spart rund vierzig Kilobyte.

   ACHTUNG ZUR LIZENZ: Die auf ihrer Seite eingesetzte Datei trägt im
   Schriftnamen den Zusatz "Personal Use" und in den eingebetteten
   Lizenzangaben den Satz "This font only personal use". Für den
   gewerblichen Einsatz ist eine Lizenz von Din Studio nötig, siehe
   https://din-studio.com/product/sisterhood-brush-font/
   Das ist vor dem Livegang zu klären. Näheres in der README.

   Die Testfassung setzt an die Stelle einzelner Zeichen ein Wasserzeichen
   des Herstellers, einen ganzen Schriftzug "PERSONAL USE ONLY, Din Studio"
   in einer einzigen Glyphe.

   WELCHE Zeichen das sind, ist jetzt gemessen statt geraten: jedes Zeichen
   des lateinischen Bereichs wurde gezeichnet und sein Bild mit dem des
   Kommas verglichen, von dem das Wasserzeichen bekannt war. Es sind
   vierzehn:

     U+0025 %   U+0026 &   U+002C ,   U+002E .   U+0030 bis U+0039 0-9

   Die fruehere Fassung nannte vier davon und lag bei zweien daneben: das
   Apostroph U+0027 ist unbedenklich, das Kaufmanns-Und und alle zehn
   Ziffern waren nicht ausgenommen. Auf der Seite fuer Fuehrungskraefte
   stand deshalb im Auszeichner "1:1-Coaching fuer Frauen in Fuehrung"
   das Wasserzeichen mitten im Satz, und zwar auch dann noch, als die
   Schrift in Elementor unter Eigene Schriftarten schon geloescht war.
   Denn sie kommt gar nicht von dort, sondern aus dieser Datei hier.

   Damit die Texte trotzdem frei formuliert und in WordPress bearbeitet
   werden koennen, sind diese Zeichen unten aus dem Zeichenvorrat der
   Schrift ausgenommen. Der Browser holt sie sich dann aus der
   Ersatzschrift, der Rest bleibt Schreibschrift.

   Bei Ziffern faellt der Wechsel staerker auf als bei Satzzeichen. Wo das
   stoert, gehoert in den Auszeichner keine Ziffer, also "Eins zu eins"
   statt "1:1". Das ist immer noch besser als ein Wasserzeichen.

   Sobald die Lizenz da ist, entfaellt einfach die Zeile mit dem
   unicode-range, und alle Zeichen kommen wieder aus ihrer Schrift. */
@font-face{font-family:'Sisterhood';font-style:normal;font-weight:400;font-display:swap;
  src:url(../fonts/sisterhood.woff2) format('woff2'),
      url(../fonts/sisterhood.woff) format('woff');
  /* Alles ausser den vierzehn Zeichen mit Wasserzeichen. Zusaetzlich
     ausgenommen ist U+0024, das Dollarzeichen: es traegt zwar nicht das
     Wasserzeichen, zeichnet aber den Schriftzug "Sisterhood". */
  unicode-range:U+0000-0023, U+0027-002B, U+002D, U+002F, U+003A-10FFFF}
/* Ihre CI kennt genau zwei Schriften, so steht es in ihrer Rückmeldung
   vom 29.08.: Montserrat als Hauptschrift, Sisterhood für Highlights und
   Überschriften. Roboto und Roboto Slab sind deshalb entfallen, samt der
   zwanzig Dateien, die sie gebraucht haben. Das spart nebenbei rund
   vierhundert Kilobyte beim ersten Aufruf. */

/* Montserrat, die Navigationsschrift ihrer bestehenden Seite. Dort steht sie
   in Versalien über dem Grauband. Die Datei ist eine veränderliche Schrift,
   eine Datei deckt deshalb alle Strichstärken ab. Quelle ist ihre eigene
   Mediathek, die Schrift steht unter der Open Font License. */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/montserrat-var-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/montserrat-var-lat.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  /* Markenfarben, unverändert aus der bestehenden Seite */
  --petrol:#004B58;          /* Primärfarbe */
  --petrol-dark:#00343E;
  --petrol-light:#0C6675;
  --gold:#A9A07B;            /* Sekundärfarbe */
  --gold-light:#C4BC9C;
  --gold-pale:#E6E1D2;
  --gold-ink:#7A7049;      /* Gold als Text auf hellem Grund, kontraststark */
  --gold-ink-grau:#5F5836;   /* dasselbe Gold auf dem grauen Kopfband, dort
                                braucht es mehr Tiefe: 4,97 statt 3,44 */
  --gold-band:#DCD2AE;       /* Gold für den Schriftzug auf dem Meerbild.
                                Ihr helles Gold käme dort nur auf 3,7 und
                                reicht für die kleine Zeile nicht. */
  --gold-karte:#CFC7A8;      /* Gold auf einer halbdurchsichtigen Karte in
                                einem Petrolabschnitt. Der Grund ist dort
                                rgb(20,88,100), und das helle Gold käme nur
                                auf 4,22. Dieser Ton erreicht 4,75. */
  --berry:#630C39;           /* Textakzent der Originalseite */
  --berry-deep:#4A0829;
  --berry-light:#8A2255;

  /* Flächen, heller und wärmer als bisher */
  --bg:#FAF9F7;
  --bg-2:#F2F0EB;
  --bg-3:#E8E5DD;
  --white:#FFFFFF;

  /* Der Kopfbereich der bestehenden Seite. Grauband und Untermenue sind
     Elementor-Werte aus ihrem Kopf-Template, nur die Deckkraft ist voll
     gesetzt, damit die Navigation beim Scrollen nicht durchscheint. */
  --head-grau:#D7D7D6;
  --head-grau-hell:#EDEDEC;
  --gold-kante:#CDC4A3;      /* die goldene Unterkante ihrer Klappmenues */

  --ink:#1E2226;
  --ink-body:#4A5157;
  --ink-mute:#626A70;

  --on-dark:#F5F3EE;
  --on-dark-mute:rgba(245,243,238,.76);

  --line:rgba(30,34,38,.12);
  --line-strong:rgba(30,34,38,.22);
  --line-inv:rgba(245,243,238,.18);

  /* Ihre CI kennt genau zwei Schriften, so steht es in ihrer Rückmeldung
     vom 29.08.: Montserrat als Hauptschrift, Sisterhood für Highlights und
     Überschriften. Roboto und Roboto Slab sind entfallen. Damit sind alle
     drei Rollen, Fließtext, Überschrift und Navigation, dieselbe Schrift
     und unterscheiden sich nur in Strichstärke und Laufweite. */
  --f-text:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --f-head:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --f-nav:'Montserrat','Helvetica Neue',Arial,sans-serif;
  --f-script:'Sisterhood',Georgia,cursive;   /* ihre Schreibschrift */
  --gold-script:#82795C;     /* Gold für die Schreibschrift auf hellem Grund */

  --max:1200px;
  --narrow:780px;
  --pad:24px;
  --sec:104px;
  --r:14px;
  --r-lg:22px;
  --ease:cubic-bezier(.22,.61,.3,1);
  --shadow:0 2px 4px rgba(30,34,38,.03), 0 12px 32px rgba(30,34,38,.06);
  --shadow-lg:0 4px 8px rgba(30,34,38,.04), 0 24px 60px rgba(30,34,38,.10);
}
:where(.elementor-widget-html),:where(.elementor-widget-html) *,:where(.elementor-widget-html)::before,:where(.elementor-widget-html) *::before,:where(.elementor-widget-html)::after,:where(.elementor-widget-html) *::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{font-family:var(--f-text);font-size:16.5px;font-weight:400;line-height:1.68;
  color:var(--ink-body);background:var(--bg);overflow-x:hidden;-webkit-font-smoothing:antialiased}
:where(.elementor-widget-html) img{max-width:100%;height:auto;display:block}
:where(.elementor-widget-html) ul,:where(.elementor-widget-html) ol{list-style:none}
:where(.elementor-widget-html) a{color:var(--petrol);text-decoration:none;transition:color .25s var(--ease)}
:where(.elementor-widget-html) a:hover{color:var(--berry)}
:where(.elementor-widget-html) button{font:inherit;background:none;border:none;cursor:pointer;color:inherit}
::selection{background:var(--petrol);color:var(--white)}
:focus-visible{outline:2px solid var(--petrol);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.narrow{max-width:var(--narrow);margin:0 auto}
:where(.elementor-widget-html) section{padding:var(--sec) 0;position:relative}
:where(.elementor-widget-html) h1,:where(.elementor-widget-html) h2,:where(.elementor-widget-html) h3,:where(.elementor-widget-html) h4{font-family:var(--f-head);color:var(--ink);line-height:1.18;font-weight:600;
  overflow-wrap:break-word;hyphens:auto}
:where(.elementor-widget-html) h1{font-size:clamp(31px,4.1vw,49px);line-height:1.12;letter-spacing:-.022em}
:where(.elementor-widget-html) h2{font-size:clamp(26px,3vw,36px);letter-spacing:-.018em}
:where(.elementor-widget-html) h3{font-size:clamp(19px,1.9vw,23px);letter-spacing:-.012em}
:where(.elementor-widget-html) h4{font-size:17px;letter-spacing:-.008em}
:where(.elementor-widget-html) p+p{margin-top:1.05em}
:where(.elementor-widget-html) strong{font-weight:500;color:var(--ink)}
:where(.elementor-widget-html) em{font-style:italic}
.lead{font-size:clamp(17px,1.55vw,19.5px);line-height:1.66;color:var(--ink-body)}
.small{font-size:14.5px;line-height:1.6;color:var(--ink-mute)}
.tc{text-align:center}
.kicker{display:block;font-family:var(--f-script);
  font-size:clamp(25px,5vw,42px);line-height:1.35;font-weight:400;
  letter-spacing:0;text-transform:none;color:var(--gold-script);
  margin-bottom:2px}
.kicker.lang{font-size:clamp(24px,3.6vw,34px);line-height:1.3;margin-bottom:12px}
.kicker.on-dark{color:var(--gold-light)}
.kicker.berry{color:var(--gold-script)}
.on-berry .kicker,.on-petrol .kicker,.on-meer .kicker{color:var(--gold-light)}
.sec-head{max-width:660px;margin-bottom:52px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head p{margin-top:18px}
.on-petrol{background:var(--petrol);color:var(--on-dark-mute)}
.on-berry{background:var(--berry);color:var(--on-dark-mute)}
.on-petrol h1,.on-petrol h2,.on-petrol h3,.on-petrol h4,.on-berry h1,.on-berry h2,.on-berry h3,.on-berry h4{color:var(--on-dark)}
.on-petrol strong,.on-berry strong{color:var(--on-dark)}
.on-petrol .lead,.on-berry .lead{color:var(--on-dark-mute)}
.on-petrol a:not(.btn),.on-berry a:not(.btn){color:var(--gold-light)}
.tone{background:var(--bg-2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--f-text);font-size:15px;font-weight:500;letter-spacing:.01em;
  padding:15px 30px;border-radius:999px;line-height:1.2;text-align:center;
  transition:transform .25s var(--ease),background .25s var(--ease),
             color .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
  border:1.5px solid transparent}
.btn svg{width:16px;height:16px;flex:0 0 16px;transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--petrol);color:var(--white);border-color:var(--petrol)}
.btn-primary:hover{background:var(--petrol-dark);border-color:var(--petrol-dark);
  color:var(--white);box-shadow:var(--shadow)}
.btn-gold{background:var(--gold);color:var(--petrol-dark);border-color:var(--gold)}
.btn-gold:hover{background:var(--gold-light);border-color:var(--gold-light);
  color:var(--petrol-dark);box-shadow:var(--shadow)}
.btn-line{background:transparent;color:var(--petrol);border-color:var(--line-strong)}
.btn-line:hover{border-color:var(--petrol);color:var(--petrol);background:rgba(0,75,88,.04)}
.btn-inv-line{background:transparent;color:var(--on-dark);border-color:var(--line-inv)}
.btn-inv-line:hover{border-color:var(--gold-light);color:var(--gold-light)}
.btn-lg{padding:18px 38px;font-size:16px}
.btn-block{width:100%}
.draft{background:var(--petrol-dark);color:var(--on-dark-mute);font-size:12.5px;
  padding:9px 20px;text-align:center;line-height:1.5}
.draft b{color:var(--gold-light);font-weight:500}
.draft-v{opacity:.62;white-space:nowrap}
.draft-v:empty{display:none}
.markenband{position:relative;z-index:0;height:366px;overflow:hidden;
  /* Der erklärte Grundton ist der hellste Bildpunkt des Bildes, nachdem
     Deckkraft und Schleier darauf gerechnet sind. Damit misst die
     Kontrastprüfung genau den schlechtesten Punkt und nicht den Durchschnitt. */
  background:#02626C}
.mb-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 62%;opacity:.62}
.markenband::after{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,44,52,.06) 0%,rgba(0,44,52,.30) 100%)}
.mb-wort{position:absolute;left:0;right:0;bottom:30px;z-index:1;text-align:center;
  font-family:var(--f-head);font-size:clamp(26px,3.6vw,46px);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;line-height:1.1;
  color:var(--gold-band);padding:0 var(--pad)}
.mb-wort span{display:block;font-family:var(--f-nav);font-weight:500;
  font-size:clamp(12px,1.15vw,15px);letter-spacing:.26em;margin-top:12px}
.markenband::before{content:'';position:absolute;left:0;right:0;bottom:0;height:7px;z-index:2;
  background:linear-gradient(90deg,
    #B5AD8D 0%, #A9A07B 6%, #C0B693 12%, #E5DBBA 20%, #C3B996 30%,
    #A9A07B 40%, #A9A07B 60%, #BDB38F 70%, #DBD1B0 80%, #A9A07B 88%,
    #A9A07B 94%, #B5AD8D 100%)}
.head{position:sticky;top:0;z-index:900;
  width:100%;max-width:1140px;margin:-366px auto 156px;
  /* Fast deckend: über dem Bild bleibt ein Hauch Wasser sichtbar, beim
     Scrollen über dem Inhalt bleibt die Navigation trotzdem lesbar. */
  background:rgba(215,215,214,.96)}
.head-top{display:none;height:152px;padding:26px 0 14px;text-align:center;overflow:hidden}
.brand-big{display:inline-block}
.brand-big img{width:104px;height:108px;display:block;margin:0 auto}
.head-bar{position:relative;z-index:2;
  box-shadow:0 1px 0 rgba(0,75,88,.10),0 10px 24px rgba(0,44,52,.10)}
.head-in{display:flex;align-items:center;gap:20px;min-height:58px;
  margin:0 auto;padding:0 var(--pad)}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto;min-width:0}
.brand img{width:38px;height:39px;flex:0 0 38px}
.brand b{font-family:var(--f-head);font-size:16px;font-weight:600;color:var(--petrol);
  display:block;line-height:1.15;white-space:nowrap}
.brand>span>span{font-family:var(--f-nav);font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink-grau);display:block;margin-top:2px;
  white-space:nowrap;font-weight:500}
.nav{display:none;align-items:center;justify-content:center;flex:1 1 auto;gap:4px}
.nav>a,.nav-drop-btn{display:flex;align-items:center;gap:7px;position:relative;
  font-family:var(--f-nav);font-size:14px;font-weight:500;letter-spacing:.07em;
  text-transform:uppercase;color:var(--petrol);padding:18px 20px;line-height:1.2}
.nav>a::after,.nav-drop-btn::after{content:'';position:absolute;left:20px;right:calc(100% - 20px);
  bottom:12px;height:2px;background:var(--gold);transition:right .3s var(--ease)}
.nav>a:hover,.nav-drop-btn:hover{color:var(--petrol-dark)}
.nav>a:hover::after,.nav-drop-btn:hover::after,.nav-drop:hover .nav-drop-btn::after,.nav-drop-btn[aria-expanded="true"]::after{right:20px}
.nav>a[aria-current="page"]::after,.nav-drop.here .nav-drop-btn::after{right:20px}
.nav-drop-btn svg{width:12px;height:12px;transition:transform .25s var(--ease)}
.nav-drop-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav-drop{position:relative}
.nav-menu{position:absolute;top:100%;left:50%;transform:translate(-50%,8px);
  width:310px;background:var(--head-grau-hell);
  border-bottom:6px solid var(--gold-kante);box-shadow:var(--shadow-lg);
  opacity:0;visibility:hidden;transition:opacity .22s var(--ease),
  transform .22s var(--ease),visibility .22s var(--ease)}
.nav-drop:hover .nav-menu,.nav-drop:focus-within .nav-menu,.nav-drop-btn[aria-expanded="true"] + .nav-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nav-drop.picked .nav-menu{opacity:0;visibility:hidden;transform:translate(-50%,8px)}
.nav-menu a{display:block;padding:14px 22px;border-bottom:1px solid #C4C4C4;
  transition:background .2s var(--ease)}
.nav-menu a:last-child{border-bottom:0}
.nav-menu a:hover{background:#E4E4E3}
.nav-menu b{display:block;font-family:var(--f-nav);font-size:14.5px;font-weight:500;
  color:var(--petrol);line-height:1.3}
.nav-menu-sub{padding-left:40px !important;position:relative}
.nav-menu-sub::before{content:"";position:absolute;left:24px;top:50%;
  width:9px;height:1px;background:var(--gold-kante)}
.mnav a.mnav-sub2:not(.btn){padding-left:44px}
.mnav-group{display:block;font-family:var(--f-nav);font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold-ink-grau);font-weight:500;padding:20px 0 8px}
.burger{display:flex;flex-direction:column;gap:5px;padding:10px;margin-left:auto}
.burger span{width:22px;height:2px;background:var(--petrol);display:block;border-radius:2px;
  transition:transform .3s var(--ease),opacity .2s var(--ease)}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mnav{display:none;position:absolute;top:100%;left:0;right:0;z-index:5;
  border-top:1px solid rgba(0,75,88,.14);background:var(--head-grau-hell);
  border-bottom:6px solid var(--gold-kante);padding:10px var(--pad) 22px;
  max-height:calc(100vh - 58px);overflow-y:auto;box-shadow:0 18px 34px rgba(0,44,52,.16)}
.mnav.open{display:block}
.mnav a:not(.btn){display:block;padding:13px 0;font-family:var(--f-nav);font-size:16px;
  font-weight:500;color:var(--petrol);border-bottom:1px solid #C4C4C4}
.mnav a.mnav-sub:not(.btn){padding-left:18px;position:relative;text-transform:none;
  letter-spacing:0}
.mnav a.mnav-sub:not(.btn)::before{content:'';position:absolute;left:0;top:23px;
  width:9px;height:1.5px;background:var(--gold)}
.mnav .btn{margin-top:18px;width:100%}
@media(min-width:1040px){
.head{top:-152px}
.head-top{display:block}
.nav{display:flex}
.head-bar .brand{display:none}
.burger{display:none}
.mnav{display:none!important}
}
@media(max-width:1039px){
.markenband{height:250px}
.head{margin:-250px auto 192px;max-width:100%}
.mb-wort{bottom:18px}
}
.floatcta{display:none}
body[data-floatcta="guide"] .floatcta-guide,body[data-floatcta="gespraech"] .floatcta-gespraech,body.floatcta-guide .floatcta-guide,body.floatcta-gespraech .floatcta-gespraech{position:fixed;right:20px;bottom:20px;z-index:810;
  display:inline-flex;align-items:center;gap:10px;
  background:var(--petrol);color:var(--gold-light);
  font-family:var(--f-text);font-size:16px;font-weight:500;
  padding:15px 20px;box-shadow:0 0 10px rgba(0,0,0,.5)}
.floatcta:hover{background:var(--petrol-dark);color:#DCD2AE}
.floatcta svg{width:17px;height:17px;flex:0 0 17px}
/* Dezenter Puls, damit der Knopf auffällt, ohne zu zappeln. Er läuft nur
   dreimal beim Laden und danach beim Überfahren, und er steht still, wenn
   im Gerät zurückgenommene Bewegung eingestellt ist. */
@keyframes floatcta-puls{
  0%,100%{box-shadow:0 0 10px rgba(0,0,0,.5), 0 0 0 0 rgba(169,160,123,.55)}
  70%{box-shadow:0 0 10px rgba(0,0,0,.5), 0 0 0 14px rgba(169,160,123,0)}
}
.floatcta.puls{animation:floatcta-puls 2.4s var(--ease) 1.2s 3}
.floatcta.puls:hover{animation:floatcta-puls 2.4s var(--ease) infinite}
@media(max-width:600px){
.floatcta{left:14px;right:14px;bottom:14px;justify-content:center;
    font-size:15px;padding:14px 16px}
}
.calendly-badge-widget{display:none !important}
.hero{padding:72px 0 88px;background:
  radial-gradient(1000px 520px at 82% -8%, rgba(169,160,123,.20), transparent 62%),
  radial-gradient(760px 420px at 4% 100%, rgba(0,75,88,.07), transparent 60%),
  var(--bg)}
.hero-in{display:grid;grid-template-columns:minmax(0,1fr);gap:48px;align-items:center}
.hero h1{margin-bottom:22px}
.hero h1 .hl{color:var(--petrol)}
.hero .lead{max-width:52ch;margin-bottom:30px}
.hero-points{display:grid;grid-template-columns:minmax(0,1fr);gap:13px;margin-bottom:34px}
.hero-points li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--ink-body);line-height:1.5}
.hero-points .ck{flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:var(--gold-pale);
  display:grid;place-items:center;margin-top:1px}
.hero-points .ck svg{width:12px;height:12px;color:var(--petrol)}
.hero-cta{display:flex;flex-wrap:wrap;gap:13px;margin-bottom:26px}
.hero-note{font-size:14px;color:var(--ink-mute)}
.hero-figure{position:relative}
.hero-figure .ph{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:var(--bg-3)}
.hero-figure .ph img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 18%}
.hero-figure .sig{position:absolute;left:-14px;bottom:-14px;width:88px;height:88px;
  border-radius:50%;background:var(--bg);padding:8px;box-shadow:var(--shadow)}
@media(min-width:920px){
.hero-in{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:56px}
.hero{padding:88px 0 110px}
}
.stats{background:var(--petrol);padding:0}
.stats ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.stats li{padding:30px 18px;text-align:center;border-right:1px solid var(--line-inv);
  border-bottom:1px solid var(--line-inv)}
.stats li:nth-child(2n){border-right:none}
.stats li:nth-last-child(-n+2){border-bottom:none}
.stats .n{font-family:var(--f-head);font-size:clamp(24px,2.7vw,33px);font-weight:600;
  color:var(--gold-light);display:block;line-height:1;
  overflow-wrap:break-word;hyphens:auto}
.stats .t{font-size:13px;color:var(--on-dark-mute);margin-top:9px;display:block;line-height:1.45}
.stats.worte .n{font-size:clamp(17px,4.4vw,26px);line-height:1.2}
@media(min-width:800px){
.stats ul{grid-template-columns:repeat(4,minmax(0,1fr))}
.stats li{border-bottom:none}
.stats li:nth-child(2n){border-right:1px solid var(--line-inv)}
.stats li:last-child{border-right:none}
}
.quellen{font-size:13px;line-height:1.6;color:var(--ink-mute);
  padding-top:14px;padding-bottom:0;text-align:center}
.stats .quellen{color:var(--on-dark-mute);padding:16px 0 24px;
  border-top:1px solid var(--line-inv)}
.stats .quellen a{color:var(--gold-light);text-decoration:underline;
  text-underline-offset:3px}
.punkte{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;margin-bottom:20px}
.punkte li{font-size:15px;line-height:1.6;color:var(--ink-mute);
  padding-left:26px;position:relative}
.punkte li b{color:var(--ink-body);font-weight:500}
.punkte li::before{content:'';position:absolute;left:2px;top:8px;width:9px;height:5px;
  border-left:1.6px solid var(--gold);border-bottom:1.6px solid var(--gold);
  transform:rotate(-45deg)}
.mirror{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:44px}
.mirror li{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 26px 24px}
.mirror .q{font-family:var(--f-head);font-size:17.5px;font-weight:600;color:var(--ink);
  line-height:1.4;margin-bottom:10px}
.mirror p{font-size:15.5px;color:var(--ink-mute);line-height:1.62}
@media(min-width:860px){
.mirror{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
}
.mirror-close{margin-top:36px;text-align:center;font-family:var(--f-head);
  font-size:clamp(19px,2.1vw,24px);font-weight:400;color:var(--berry);line-height:1.42}
.check{background:var(--petrol);color:var(--on-dark-mute)}
.check-card{background:var(--white);border-radius:var(--r-lg);padding:34px 26px 30px;
  box-shadow:var(--shadow-lg);color:var(--ink-body);max-width:840px;margin:0 auto}
.check-card h1,.check-card h2,.check-card h3,.check-card h4{color:var(--ink)}
.check-card p,.check-card li,.check-card span{color:inherit}
.check-card a:not(.btn){color:var(--petrol)}
.check-card a:not(.btn):hover{color:var(--berry)}
.check-card .ck-res-name{color:var(--berry)}
.check-card .ck-res-label{color:var(--gold-ink)}
@media(min-width:760px){
.check-card{padding:44px 48px 40px}
}
.ck-bar{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.ck-track{flex:1;height:5px;background:var(--bg-3);border-radius:99px;overflow:hidden}
.ck-fill{height:100%;width:0;background:var(--gold);border-radius:99px;transition:width .35s var(--ease)}
.ck-count{font-size:13px;color:var(--ink-mute);white-space:nowrap;font-variant-numeric:tabular-nums}
.ck-q{font-family:var(--f-head);font-size:clamp(19px,2.2vw,24px);font-weight:500;
  color:var(--ink);line-height:1.36;margin-bottom:26px;min-height:2.7em;display:flex;align-items:center}
.ck-anleitung{font-size:14.5px;line-height:1.6;color:var(--ink-mute);margin-bottom:20px}
.ck-opts{display:grid;grid-template-columns:minmax(0,1fr);gap:11px}
.ck-opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  padding:16px 20px;border:1.5px solid var(--line);border-radius:var(--r);
  background:var(--bg);font-size:16px;color:var(--ink-body);
  transition:border-color .2s var(--ease),background .2s var(--ease),transform .2s var(--ease)}
.ck-opt:hover{border-color:var(--gold);background:var(--white);transform:translateX(2px)}
.ck-opt.gewaehlt{border-color:var(--petrol);background:var(--white)}
.ck-opt.gewaehlt .ck-zahl{background:var(--petrol);color:var(--white);border-color:var(--petrol)}
.ck-zahl{flex:0 0 34px;width:34px;height:34px;border-radius:50%;
  border:1.5px solid var(--line-strong);display:grid;place-items:center;
  font-family:var(--f-head);font-size:15px;font-weight:500;color:var(--petrol);
  background:var(--white);transition:background .2s,border-color .2s,color .2s}
.ck-opt:hover .ck-zahl{border-color:var(--gold);background:var(--gold-pale)}
.ck-label{line-height:1.4}
.ck-nav{display:flex;align-items:center;justify-content:space-between;margin-top:24px;
  padding-top:20px;border-top:1px solid var(--line)}
.ck-back{font-size:14.5px;color:var(--ink-mute);display:inline-flex;align-items:center;gap:7px}
.ck-back:hover{color:var(--petrol)}
.ck-back svg{width:14px;height:14px}
.ck-hint{font-size:13px;color:var(--ink-mute)}
.ck-start h3{margin-bottom:14px}
.ck-start p{margin-bottom:26px}
.ck-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-bottom:28px}
.ck-meta li{font-size:14px;color:var(--ink-mute);display:flex;align-items:center;gap:8px}
.ck-meta li::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--gold);flex:0 0 5px}
.ck-result{display:none}
.ck-result.on{display:block;animation:fadeUp .5s var(--ease) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ck-res-top{text-align:center;padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:26px}
.ck-res-label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);
  display:block;margin-bottom:12px}
.ck-res-name{font-family:var(--f-head);font-size:clamp(27px,3.4vw,38px);font-weight:600;
  color:var(--berry);line-height:1.14;margin-bottom:14px}
.ck-res-sub{font-size:16px;color:var(--ink-body);max-width:52ch;margin:0 auto}
.ck-profil{margin-bottom:30px}
.ck-profil h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-ink);font-family:var(--f-text);font-weight:500;margin-bottom:18px}
.ck-balken{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.ck-balken-kopf{display:flex;justify-content:space-between;align-items:baseline;
  gap:14px;margin-bottom:7px}
.ck-balken-name{font-family:var(--f-head);font-size:16.5px;font-weight:500;color:var(--ink)}
.ck-balken-wert{font-size:14px;color:var(--ink-mute);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.ck-balken-spur{height:9px;border-radius:99px;background:var(--bg-3);overflow:hidden}
.ck-balken-voll{height:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--petrol),var(--petrol-light));
  transition:width .7s var(--ease)}
.ck-balken li:first-child .ck-balken-voll{background:linear-gradient(90deg,var(--berry),var(--berry-light))}
.ck-balken-stufe{display:block;font-size:12.5px;color:var(--ink-mute);margin-top:6px}
.ck-antreiber-text{border:1px solid var(--line);border-radius:var(--r);
  padding:26px 24px 22px;background:var(--bg);margin-bottom:16px}
.ck-antreiber-text h4{font-size:20px;margin-bottom:10px}
.ck-antreiber-text h5{font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-ink);font-family:var(--f-text);font-weight:500;margin:18px 0 7px}
.ck-antreiber-text p{font-size:15.5px;line-height:1.65;color:var(--ink-body)}
.ck-regel{font-family:var(--f-head);font-size:18px;color:var(--berry);
  line-height:1.45;padding:14px 0 0;border-top:1px solid var(--line)}
.ck-schluss{background:rgba(0,75,88,.05);border-radius:var(--r);
  padding:24px 22px;margin:26px 0 28px}
.ck-schluss p{font-size:15.5px;line-height:1.65;color:var(--petrol)}
.ck-schluss p+p{margin-top:12px}
.ck-methodik{margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.ck-methodik h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-mute);font-family:var(--f-text);font-weight:500;margin-bottom:12px}
.ck-methodik p{font-size:13px;line-height:1.65;color:var(--ink-mute)}
.ck-methodik p+p{margin-top:10px}
.ck-quellen{margin-top:14px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.ck-quellen li{font-size:12.5px;line-height:1.6;color:var(--ink-mute);
  padding-left:16px;position:relative}
.ck-quellen li::before{content:'';position:absolute;left:0;top:9px;width:7px;height:1.5px;
  background:var(--gold)}
.ck-data{display:none !important}
.ck-next{background:var(--bg-2);border-radius:var(--r);padding:26px 24px;margin-top:8px}
.ck-next h4{font-size:17px;margin-bottom:8px}
.ck-next>p{font-size:15px;color:var(--ink-mute);margin-bottom:20px}
.ck-next-btns{display:grid;grid-template-columns:minmax(0,1fr);gap:11px}
@media(min-width:620px){
.ck-next-btns{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.ck-weg{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 22px 20px;margin-top:16px;position:relative}
.ck-weg-haupt{border-color:var(--gold);border-top:3px solid var(--gold)}
.ck-weg-no{position:absolute;top:-13px;left:22px;width:26px;height:26px;
  display:grid;place-items:center;border-radius:50%;background:var(--gold);
  color:var(--petrol-dark);font-family:var(--f-head);font-size:13px;font-weight:600}
.ck-weg h5{font-size:17px;font-family:var(--f-head);font-weight:500;color:var(--ink);
  margin:6px 0 8px;line-height:1.35}
.ck-weg-claim{font-family:var(--f-head);font-size:15.5px !important;
  color:var(--berry) !important;margin-bottom:12px !important}
.ck-weg p{font-size:15px;line-height:1.65;color:var(--ink-mute);margin-bottom:14px}
.ck-weg-liste{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-bottom:16px}
.ck-weg-liste li{font-size:14.5px;line-height:1.6;color:var(--ink-mute);
  padding-left:24px;position:relative}
.ck-weg-liste li b{color:var(--ink-body);font-weight:500}
.ck-weg-liste li::before{content:'';position:absolute;left:2px;top:7px;width:9px;height:5px;
  border-left:1.6px solid var(--gold);border-bottom:1.6px solid var(--gold);
  transform:rotate(-45deg)}
.ck-weg-note{font-size:12.5px !important;line-height:1.55 !important;
  color:var(--ink-mute) !important;margin:11px 0 0 !important;text-align:center}
.ck-weg-academy{font-size:14.5px;line-height:1.65;color:var(--ink-mute);
  margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
.ck-weg-academy a{color:var(--petrol);text-decoration:underline;
  text-decoration-color:var(--gold);text-underline-offset:3px}
.ck-weg-academy a:hover{color:var(--berry)}
.ck-quelle{font-size:13px;line-height:1.6;color:var(--ink-mute);
  margin-top:20px;padding-top:16px;border-top:1px solid var(--line);
  max-width:52ch}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ck-consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;
  line-height:1.5;color:var(--ink-mute);cursor:pointer}
.ck-consent input{flex:0 0 16px;width:16px;height:16px;margin-top:2px;
  accent-color:var(--petrol);cursor:pointer}
.ck-consent a{text-decoration:underline}
.wl-form{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;margin-top:4px}
.wl-form input[type=email]{width:100%;padding:14px 16px;border-radius:var(--r);
  border:1.5px solid var(--line-inv);background:rgba(245,243,238,.10);
  color:var(--on-dark);font-family:var(--f-text);font-size:15px}
.wl-form input[type=email]::placeholder{color:var(--on-dark-mute)}
.wl-form input[type=email]:focus{outline:none;border-color:var(--gold-light);
  background:rgba(245,243,238,.16)}
.wl-form .ck-consent{color:var(--on-dark-mute)}
.wl-form .ck-consent a{color:var(--gold-light)}
.wl-form .ck-consent input{accent-color:var(--gold)}
.form-ok{font-size:13.5px;line-height:1.55;padding:14px 16px;border-radius:var(--r);
  background:rgba(0,75,88,.07);color:var(--petrol);border:1px solid rgba(0,75,88,.18)}
.wl-form-ok{font-size:13.5px;line-height:1.55;padding:14px 16px;border-radius:var(--r);
  background:rgba(245,243,238,.12);color:var(--on-dark);border:1px solid var(--line-inv)}
.wl-danach{font-size:14px;line-height:1.62;color:var(--on-dark-mute);
  margin:16px 0 14px}
.lead-offer-side .form-fertig .weiter{color:var(--gold-light);
  text-decoration:underline;text-underline-offset:3px;text-align:center;width:100%}
.lead-offer-side .form-fertig .weiter:hover{color:var(--on-dark)}
.ck-restart{display:block;margin:22px auto 0;font-size:14px;color:var(--ink-mute);text-decoration:underline}
.ck-restart:hover{color:var(--petrol)}
.shift-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;margin-top:46px;border-radius:var(--r-lg);overflow:hidden}
.shift-col{padding:34px 30px}
.shift-a{background:rgba(245,243,238,.08)}
.shift-b{background:rgba(169,160,123,.20)}
.shift-col .lbl{font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  display:block;margin-bottom:16px;color:var(--gold-light)}
.shift-col ul{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.shift-col li{font-size:16px;line-height:1.55;padding-left:22px;position:relative;color:var(--on-dark-mute)}
.shift-col li::before{content:'';position:absolute;left:0;top:10px;width:9px;height:1.5px;background:var(--gold-light)}
.shift-b li{color:var(--on-dark)}
@media(min-width:820px){
.shift-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.cmp{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:46px}
.cmp-col{border:1px solid var(--line);border-radius:var(--r-lg);padding:32px 30px;background:var(--white)}
.cmp-col.plus{background:var(--petrol);border-color:var(--petrol)}
.cmp-col .lbl{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--ink-mute);margin-bottom:20px}
.cmp-col.plus .lbl{color:var(--gold-light)}
.cmp-col ul{display:grid;grid-template-columns:minmax(0,1fr);gap:13px}
.cmp-col li{font-size:16px;line-height:1.55;color:var(--ink-mute);
  padding-left:28px;position:relative}
.cmp-col.plus li{color:var(--on-dark)}
.cmp-col li::before{content:'';position:absolute;left:4px;top:9px;width:11px;height:1.5px;
  background:var(--line-strong)}
.cmp-col.plus li::before{left:2px;top:6px;width:9px;height:5px;background:none;
  border-left:1.6px solid var(--gold-light);border-bottom:1.6px solid var(--gold-light);
  transform:rotate(-45deg)}
@media(min-width:820px){
.cmp{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
}
.levers{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;margin-top:48px;counter-reset:lv}
.lever{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:32px 28px 28px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.lever:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--gold-light)}
.lever .no{font-family:var(--f-head);font-size:13px;font-weight:500;letter-spacing:.1em;
  color:var(--gold-ink);display:block;margin-bottom:16px}
.lever h3{margin-bottom:6px}
.lever .vs{font-size:14px;color:var(--berry);margin-bottom:16px;display:block}
.lever p{font-size:15.5px;color:var(--ink-mute);line-height:1.65;margin-bottom:18px}
.lever ul{display:grid;grid-template-columns:minmax(0,1fr);gap:9px}
.lever li{font-size:15px;color:var(--ink-body);padding-left:20px;position:relative;line-height:1.5}
.lever li::before{content:'';position:absolute;left:0;top:9px;width:7px;height:7px;
  border-radius:50%;background:var(--gold-pale);border:1.5px solid var(--gold)}
@media(min-width:900px){
.levers{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.hebel-schluss{max-width:760px;margin:44px auto 0;text-align:center;
  padding-top:34px;border-top:1px solid var(--line)}
.hebel-schluss h3{margin-bottom:14px}
.hebel-schluss p{font-size:16px;line-height:1.7;color:var(--ink-body)}
.hebel-schluss-satz{margin-top:16px;font-family:var(--f-head);font-weight:600;
  font-size:clamp(17px,1.9vw,21px);line-height:1.45;color:var(--berry);
  letter-spacing:-.012em}
.gold-text{
  /* Als Rückfall steht hier bewusst der dunkelste Verlaufspunkt und nicht
     der hellste. So rechnet die Kontrastprüfung mit dem schlechtesten
     Punkt des Verlaufs, und Browser ohne diese Technik bekommen einen
     Ton, der auf dunklem Grund sicher lesbar ist. */
  color:#A99F7A;
  background-image:linear-gradient(90deg,#A99F7A,#c4b88d,#ddd09f);
  background-clip:text;
  -webkit-background-clip:text;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
.gold-text{-webkit-text-fill-color:transparent}
}
.mid-cta{margin-top:56px;text-align:center}
.mid-cta .btn{margin:0 6px 10px}
.mid-cta .note{font-size:13.5px;color:var(--ink-mute);margin-top:10px}
.on-petrol .mid-cta .note,.on-berry .mid-cta .note,.on-meer .mid-cta .note{color:var(--on-dark-mute)}
.goldbar{height:11px;width:100%;border:0;display:block;
  background:linear-gradient(90deg,
    #B5AD8D 0%, #A9A07B 6%, #C0B693 12%, #E5DBBA 20%, #C3B996 30%,
    #A9A07B 40%, #A9A07B 60%, #BDB38F 70%, #DBD1B0 80%, #A9A07B 88%,
    #A9A07B 94%, #B5AD8D 100%)}
.on-meer{position:relative;background-color:#004954;color:var(--on-dark-mute)}
.on-meer::before{content:'';position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(0,52,62,.80),rgba(0,52,62,.76)),
    image-set(url('../img/meer-1800.jpg') 1x, url('../img/meer-2078.jpg') 2x);
  background-size:cover;background-position:center center}
.on-meer>*{position:relative;z-index:1}
.on-meer h1,.on-meer h2,.on-meer h3,.on-meer h4{color:var(--on-dark)}
.on-meer strong{color:var(--on-dark)}
.on-meer .lead{color:var(--on-dark-mute)}
.on-meer a:not(.btn){color:var(--gold-light)}
.orn{display:block;margin:0 auto 20px;width:38px;height:auto}
.sec-head.center .orn{margin-bottom:18px}
.totop{position:fixed;left:20px;bottom:20px;z-index:800;width:46px;height:46px;
  display:flex;align-items:center;justify-content:center;border-radius:var(--r);
  background:var(--petrol);color:var(--gold-light);box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .3s var(--ease),transform .3s var(--ease),
             visibility .3s var(--ease),background .25s var(--ease)}
.totop.on{opacity:1;visibility:visible;transform:none}
.totop:hover{background:var(--petrol-dark);color:var(--gold-light)}
.totop svg{width:19px;height:19px}
@media(max-width:600px){
.totop{left:14px;bottom:76px;width:42px;height:42px}
}
.lead-offer{background:var(--petrol);color:var(--on-dark-mute);
  border-radius:var(--r-lg);padding:40px 34px;display:grid;grid-template-columns:minmax(0,1fr);gap:34px;
  box-shadow:var(--shadow-lg)}
.lead-offer h3,.lead-offer h4{color:var(--on-dark)}
.lead-offer-main{min-width:0}
.lo-claim{font-family:var(--f-head);font-size:clamp(21px,2.3vw,27px);line-height:1.28;
  color:var(--on-dark);margin-bottom:24px}
.lo-list{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.lo-list li{font-size:16px;line-height:1.55;color:var(--on-dark-mute);
  padding-left:26px;position:relative}
.lo-list li::before{content:'';position:absolute;left:2px;top:7px;width:9px;height:5px;
  border-left:1.6px solid var(--gold-light);border-bottom:1.6px solid var(--gold-light);
  transform:rotate(-45deg)}
.lead-offer-side{background:rgba(245,243,238,.08);border:1px solid var(--line-inv);
  border-radius:var(--r);padding:28px 24px;align-self:start}
.lo-price{font-family:var(--f-head);font-size:40px;font-weight:500;color:var(--gold-light);
  line-height:1;margin-bottom:4px}
.lo-price small{display:block;font-family:var(--f-text);font-size:13.5px;font-weight:400;
  color:var(--on-dark-mute);margin-top:9px}
.lo-meta{font-size:14px;line-height:1.6;color:var(--on-dark-mute);
  padding:16px 0 20px;margin-top:16px;border-top:1px solid var(--line-inv)}
@media(min-width:900px){
.lead-offer{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:48px;padding:46px 44px}
}
.tracks-titel{text-align:center;margin:52px 0 14px}
.tracks-intro{text-align:center;margin:0 auto 30px;font-size:15.5px;
  line-height:1.7;color:var(--ink-mute);max-width:70ch}
.track .track-lead{text-align:left;font-size:15px;line-height:1.65;
  color:var(--ink-mute);margin-bottom:20px}
.track ul+.track-lead{margin-top:-8px;margin-bottom:24px}
.tracks{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.track{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:32px 30px;display:flex;flex-direction:column}
.track-lbl{display:inline-block;align-self:flex-start;font-size:11.5px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--petrol);
  background:var(--gold-pale);padding:5px 12px;border-radius:99px;margin-bottom:16px}
.track h3{font-size:21px;margin-bottom:22px}
.track ul{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-bottom:28px;flex:1}
.track li b{display:block;font-weight:500;color:var(--ink);font-size:16px;margin-bottom:4px}
.track li span{display:block;font-size:15px;line-height:1.6;color:var(--ink-mute)}
@media(min-width:860px){
.tracks{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
}
.about{display:grid;grid-template-columns:minmax(0,1fr);gap:44px;align-items:center}
.about-ph{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.about-ph img{width:100%;aspect-ratio:4/5;object-fit:cover}
.about h2{margin-bottom:20px}
.pull{font-family:var(--f-head);font-size:clamp(19px,2vw,23px);line-height:1.42;
  color:var(--berry);border-left:2px solid var(--gold);padding:4px 0 4px 22px;
  margin:26px 0 6px}
.pull-center{border-left:0;border-top:1px solid var(--gold);padding:24px 0 0;
  margin:28px auto 0;max-width:36em;text-align:center}
.on-petrol .pull,.on-berry .pull,.on-meer .pull{color:var(--on-dark)}
.creds{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:28px}
.creds li{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px 17px;border-left:3px solid var(--gold)}
.creds b{display:block;font-family:var(--f-nav);font-size:11px;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:7px}
.creds span{display:block;font-size:15.5px;line-height:1.55;color:var(--ink-body)}
.creds a{color:var(--petrol);text-decoration:underline}
.tone .creds li{background:var(--bg)}
@media(min-width:720px){
.creds{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
}
@media(min-width:880px){
.about{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px}
}
.ethik{margin-top:32px;background:var(--bg-2);border:1px solid var(--line);
  border-radius:var(--r);padding:28px 26px}
.ethik h3{font-size:19px;margin-bottom:18px}
.ethik ul{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.ethik li{font-size:15.5px;line-height:1.6;color:var(--ink-mute);
  padding-left:22px;position:relative}
.ethik li::before{content:'';position:absolute;left:0;top:9px;width:10px;height:1.5px;
  background:var(--gold)}
.ethik b{color:var(--ink);font-weight:500}
.dfc{display:flex;align-items:center;gap:22px;margin-top:24px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:20px 22px;transition:border-color .25s var(--ease),box-shadow .25s var(--ease)}
.dfc:hover{border-color:var(--gold-light);box-shadow:var(--shadow)}
.dfc img{width:170px;height:auto;flex:0 0 170px}
.dfc b{display:block;font-family:var(--f-head);font-size:16px;font-weight:500;
  color:var(--petrol);line-height:1.35;margin-bottom:6px}
.dfc span span{display:block;font-size:14px;line-height:1.6;color:var(--ink-mute)}
@media(max-width:599px){
.dfc{flex-direction:column;align-items:flex-start;gap:16px}
.dfc img{width:150px;flex:0 0 auto}
}
.voices{display:grid;grid-template-columns:minmax(0,1fr);gap:22px;margin-top:46px}
.voice{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 28px;display:flex;flex-direction:column}
.voice blockquote{flex:1}
.voice .who{margin-top:18px}
.voice .stars{color:var(--gold-ink);letter-spacing:.2em;font-size:14px;margin-bottom:10px}
.voice .v-gain{font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--berry);font-weight:500;margin-bottom:14px}
.voice blockquote{font-family:var(--f-head);font-size:17.5px;font-weight:400;
  color:var(--ink);line-height:1.52;margin-bottom:18px}
.voice .who{font-size:13.5px;color:var(--ink-mute)}
.voice .who b{color:var(--ink);font-weight:500;display:block}
@media(min-width:880px){
.voices{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.stimme-klein{max-width:720px;margin:0 auto;text-align:center}
.stimme-klein .stars{color:var(--gold-ink);letter-spacing:.2em;font-size:14px;
  display:block;margin-bottom:14px}
.stimme-klein blockquote{font-family:var(--f-head);font-size:clamp(18px,2vw,22px);
  line-height:1.5;color:var(--ink);margin-bottom:16px}
.stimme-klein .who{font-size:13.5px;color:var(--ink-mute)}
.stimme-klein .who b{color:var(--ink);font-weight:500}
.on-petrol .stimme-klein blockquote,.on-berry .stimme-klein blockquote,.on-meer .stimme-klein blockquote{color:var(--on-dark)}
.on-petrol .stimme-klein .stars,.on-berry .stimme-klein .stars,.on-meer .stimme-klein .stars{color:var(--gold-light)}
.on-petrol .stimme-klein .who,.on-berry .stimme-klein .who,.on-meer .stimme-klein .who{color:var(--on-dark-mute)}
.on-petrol .stimme-klein .who b,.on-berry .stimme-klein .who b,.on-meer .stimme-klein .who b{color:var(--on-dark)}
.videoplatz{max-width:820px;margin:46px auto 0}
.videoplatz .rahmen{aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;
  background:var(--bg-3);border:1.5px dashed var(--line-strong);
  display:grid;place-items:center;text-align:center;padding:28px}
.videoplatz .rahmen iframe,.videoplatz .rahmen video{width:100%;height:100%;border:0;display:block}
.videoplatz .rahmen.hat-video,.tone .videoplatz .rahmen.hat-video{border-style:solid;border-color:var(--line);
  padding:0;background:var(--petrol-dark)}
.video-start{width:100%;height:100%;display:grid;place-items:center;
  align-content:center;gap:16px;
  background-size:cover;background-position:center;cursor:pointer;
  transition:filter .25s var(--ease)}
.video-start:hover{filter:brightness(1.08)}
.video-play{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;
  background:var(--gold);color:var(--petrol-dark);box-shadow:var(--shadow-lg);
  transition:transform .25s var(--ease)}
.video-play svg{width:30px;height:30px;margin-left:4px}
.video-start:hover .video-play{transform:scale(1.06)}
.video-text{font-family:var(--f-text);font-size:15px;font-weight:500;color:var(--on-dark)}
.video-hinweis{font-size:13px;line-height:1.6;color:var(--ink-mute);
  text-align:center;margin-top:12px}
.videoplatz .ic{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 16px;
  border-radius:50%;background:var(--gold-pale);color:var(--petrol)}
.videoplatz .ic svg{width:24px;height:24px}
.videoplatz .rahmen b{display:block;font-family:var(--f-head);font-size:18px;
  font-weight:500;color:var(--ink);margin-bottom:8px}
.videoplatz .rahmen p{font-size:14.5px;line-height:1.6;color:var(--ink-mute);max-width:42ch}
.tone .videoplatz .rahmen{background:var(--white)}
.google-hinweis{text-align:center;margin-top:22px;font-size:14px;color:var(--ink-mute)}
.google-hinweis a{text-decoration:underline}
.on-petrol .google-hinweis,.on-berry .google-hinweis,.on-meer .google-hinweis{color:var(--on-dark-mute)}
.cta-final{display:grid;grid-template-columns:minmax(0,1fr);gap:44px;align-items:center}
.cta-final h2{margin-bottom:20px}
.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:0;margin-top:28px}
.step{display:flex;gap:20px;padding:20px 0;border-bottom:1px solid var(--line-inv)}
.step:last-child{border-bottom:none}
.step .n{font-family:var(--f-head);font-size:19px;font-weight:500;color:var(--gold-light);flex:0 0 30px;line-height:1.4}
.step h4{color:var(--on-dark);margin-bottom:5px;font-size:17px}
.step p{font-size:15px;color:var(--on-dark-mute);line-height:1.6}
.cta-card{background:rgba(245,243,238,.07);border:1px solid var(--line-inv);
  border-radius:var(--r-lg);padding:34px 30px}
.cta-card h3{margin-bottom:8px}
.cta-card .price{font-family:var(--f-head);font-size:clamp(30px,3.2vw,40px);font-weight:500;
  color:var(--gold-light);line-height:1;margin:20px 0 4px}
.cta-card .price small{font-family:var(--f-text);font-size:14px;font-weight:400;
  color:var(--on-dark-mute);display:block;margin-top:10px}
.cta-card ul{margin:24px 0 26px;display:grid;grid-template-columns:minmax(0,1fr);gap:11px}
.cta-card li{font-size:15px;color:var(--on-dark-mute);padding-left:24px;position:relative;line-height:1.55}
.cta-card li::before{content:'';position:absolute;left:1px;top:6px;width:9px;height:5px;
  border-left:1.5px solid var(--gold-light);border-bottom:1.5px solid var(--gold-light);transform:rotate(-45deg)}
.cta-card .note{font-size:13px;color:var(--on-dark-mute);text-align:center;margin-top:14px}
@media(min-width:900px){
.cta-final{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px}
}
.faq{margin-top:44px;max-width:820px;margin-left:auto;margin-right:auto}
.faq details{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  margin-bottom:12px;overflow:hidden}
.faq summary{padding:20px 24px;font-family:var(--f-head);font-size:17px;font-weight:500;
  color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;
  align-items:center;gap:16px;line-height:1.4}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'';flex:0 0 11px;width:11px;height:11px;border-right:2px solid var(--gold);
  border-bottom:2px solid var(--gold);transform:rotate(45deg);transition:transform .25s var(--ease);margin-top:-4px}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:2px}
.faq .a{padding:0 24px 22px;font-size:15.5px;color:var(--ink-body);line-height:1.68}
.foot{position:relative;background:#003340;color:var(--on-dark-mute);
  padding:62px 0 26px;overflow:hidden}
.foot-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 60%;opacity:.28;z-index:0}
.foot::before{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(0,39,46,.55) 0%,rgba(0,39,46,.85) 100%)}
.foot>.wrap{position:relative;z-index:2}
.foot-in{display:grid;grid-template-columns:minmax(0,1fr);gap:36px}
.foot .brand b{color:var(--on-dark);font-family:var(--f-nav);font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;font-size:15px}
.foot .brand>span>span{color:var(--gold-light)}
.foot-col h4{font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-light);margin-bottom:16px;font-family:var(--f-text);font-weight:500}
.foot-col li{margin-bottom:10px;font-size:15px}
.foot-col a{color:var(--on-dark-mute)}
.foot-col a:hover{color:var(--on-dark)}
.foot .small{color:var(--on-dark-mute)}
.foot .small a{color:var(--gold-light);text-decoration:underline}
.foot .small a:hover{color:var(--on-dark)}
.foot-bottom{margin-top:44px;padding-top:22px;border-top:1px solid var(--line-inv);
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;
  color:rgba(245,243,238,.68)}
@media(min-width:820px){
.foot-in{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}
}
.phead{padding:64px 0 56px;background:
  radial-gradient(900px 460px at 78% -10%, rgba(169,160,123,.22), transparent 62%), var(--bg)}
.phead .lead{max-width:60ch;margin-top:20px}
.phead-cta{display:flex;flex-wrap:wrap;gap:13px;margin-top:32px}
.recht{max-width:var(--narrow)}
.recht a{overflow-wrap:anywhere}
.recht h2{font-size:22px;margin:38px 0 16px}
.recht p{margin-bottom:14px}
.recht-hinweis{background:var(--gold-pale);border-left:3px solid var(--gold);
  border-radius:0 var(--r) var(--r) 0;padding:20px 22px;margin-bottom:8px}
.recht-hinweis b{display:block;font-family:var(--f-head);font-size:17px;font-weight:500;
  color:var(--petrol-dark);margin-bottom:7px}
.recht-hinweis p{font-size:15px;line-height:1.65;color:var(--ink-body);margin:0}
.recht-liste{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;margin-bottom:14px}
.recht-liste li{font-size:16px;line-height:1.6;color:var(--ink-body);
  padding-left:22px;position:relative}
.recht-liste li::before{content:'';position:absolute;left:0;top:11px;width:10px;height:1.5px;
  background:var(--gold)}
.dl{display:inline-flex;align-items:flex-start;gap:14px;
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:var(--r);padding:16px 20px;max-width:460px;
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}
.dl:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--line);
  border-left-color:var(--gold)}
.dl svg{width:22px;height:22px;flex:0 0 22px;color:var(--petrol);margin-top:2px}
.dl b{display:block;font-family:var(--f-head);font-size:16px;font-weight:500;
  color:var(--petrol);line-height:1.35;margin-bottom:3px}
.dl span{display:block;font-size:13.5px;line-height:1.5;color:var(--ink-mute)}
.on-petrol .dl,.on-berry .dl,.on-meer .dl,.cta-card .dl,.lead-offer .dl{
  background:rgba(245,243,238,.09);border-color:var(--line-inv);
  border-left-color:var(--gold-light)}
.on-petrol .dl:hover,.on-berry .dl:hover,.on-meer .dl:hover,.cta-card .dl:hover,.lead-offer .dl:hover{background:rgba(245,243,238,.14)}
.on-petrol .dl b,.on-berry .dl b,.on-meer .dl b,.cta-card .dl b,.lead-offer .dl b{color:var(--on-dark)}
.on-petrol .dl span,.on-berry .dl span,.on-meer .dl span,.cta-card .dl span,.lead-offer .dl span{color:var(--on-dark-mute)}
.on-petrol .dl svg,.on-berry .dl svg,.on-meer .dl svg,.cta-card .dl svg,.lead-offer .dl svg{color:var(--gold-light)}
.fokus{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center;margin-top:8px}
.fokus-bild{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);
  background:var(--petrol-dark);margin:0}
.fokus-bild img{width:100%;aspect-ratio:4/5;object-fit:cover;
  object-position:center 18%;display:block}
.fokus-text p{margin-bottom:16px}
.fokus-text p:last-child{margin-bottom:0}
@media(min-width:900px){
.fokus{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:52px}
}
.dl-block{display:flex}
.dl-block .dl{max-width:none;flex:1}
.leistungen{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:44px}
.leistung{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 28px 26px;display:flex;flex-direction:column;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.leistung:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--gold-light)}
.leistung.heraus{background:var(--petrol);border-color:var(--petrol)}
.leistung.heraus h3,.leistung.heraus .lst-lead{color:var(--on-dark)}
.leistung.heraus .lst-kat{color:var(--gold-pale);background:rgba(245,243,238,.14)}
.leistung.heraus .lst-meta{border-color:var(--line-inv);color:var(--on-dark-mute)}
.leistung.heraus .lst-meta b{color:var(--on-dark)}
.lst-kat{display:inline-block;align-self:flex-start;font-family:var(--f-nav);
  font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--petrol);background:var(--gold-pale);padding:5px 12px;border-radius:99px;
  margin-bottom:16px}
.leistung h3{font-size:21px;margin-bottom:10px}
.lst-lead{font-size:15.5px;line-height:1.65;color:var(--ink-mute);margin-bottom:20px}
.lst-meta{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;margin-bottom:22px;padding-top:16px;
  border-top:1px solid var(--line);font-size:14.5px;line-height:1.5;color:var(--ink-mute)}
.lst-meta div{display:flex;gap:10px}
.lst-meta b{flex:0 0 92px;font-weight:500;font-family:var(--f-nav);font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);padding-top:3px}
.leistung .btn{margin-top:auto}
@media(min-width:880px){
.leistungen{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
.leistung.heraus,.leistung.breit{grid-column:1 / -1}
.leistung.breit .punkte{columns:2;column-gap:34px}
.leistung.breit .punkte li{break-inside:avoid}
.leistung.heraus .lst-meta{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px 34px}
}
.kontakt-wege{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:44px}
.kweg{display:block;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:26px 24px;text-align:center;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.kweg:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--gold-light)}
.kweg-ic{display:grid;place-items:center;width:46px;height:46px;margin:0 auto 16px;
  border-radius:50%;background:var(--gold-pale);color:var(--petrol)}
.kweg-ic svg{width:21px;height:21px}
.kweg b{display:block;font-family:var(--f-head);font-size:17px;font-weight:500;
  color:var(--petrol);line-height:1.3;margin-bottom:6px;overflow-wrap:anywhere}
.kweg span:not(.kweg-ic){display:block;font-size:14.5px;line-height:1.55;color:var(--ink-mute)}
@media(min-width:820px){
.kontakt-wege{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
}
.kal-platz{border:1.5px dashed var(--line-inv);border-radius:var(--r);
  padding:26px 22px;text-align:center;margin:22px 0 20px}
.kal-ic{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 14px;
  border-radius:50%;background:rgba(245,243,238,.10);color:var(--gold-light)}
.kal-ic svg{width:21px;height:21px}
.kal-platz p{font-size:14px;line-height:1.6;color:var(--on-dark-mute)}
.kal-platz b{color:var(--on-dark);font-weight:500;display:block;margin-bottom:4px}
.kontakt-form{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:start}
.kontakt-bild{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);
  background:var(--bg-3)}
.kontakt-bild img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 20%}
.kontakt-bild figcaption{font-size:14px;line-height:1.6;color:var(--ink-mute);
  background:var(--white);padding:16px 18px}
@media(min-width:900px){
.kontakt-form{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:36px}
}
.kform{max-width:760px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr);gap:20px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:34px 30px;box-shadow:var(--shadow)}
.kf-row{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.kf-feld{display:grid;grid-template-columns:minmax(0,1fr);gap:7px;min-width:0}
.kf-feld label{font-size:13.5px;font-weight:500;color:var(--ink-body)}
.kf-feld input,.kf-feld select,.kf-feld textarea{width:100%;padding:13px 15px;
  border-radius:var(--r);border:1.5px solid var(--line-strong);background:var(--bg);
  color:var(--ink);font-family:var(--f-text);font-size:15.5px;line-height:1.5}
.kf-feld textarea{resize:vertical;min-height:130px}
.kf-feld input::placeholder,.kf-feld textarea::placeholder{color:var(--ink-mute)}
.kf-feld input:focus,.kf-feld select:focus,.kf-feld textarea:focus{outline:none;
  border-color:var(--petrol);background:var(--white);
  box-shadow:0 0 0 3px rgba(0,75,88,.10)}
.kform .btn{justify-self:start}
.kf-note{font-size:13px;line-height:1.6;color:var(--ink-mute)}
@media(min-width:640px){
.kf-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.kform{padding:40px 38px}
}
.mods{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:46px}
.mod{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:26px 26px 24px;display:flex;gap:20px;align-items:flex-start;min-width:0}
.mod>div{min-width:0}
.mod .no{font-family:var(--f-head);font-size:15px;font-weight:500;color:var(--gold-ink);
  flex:0 0 34px;line-height:1.5}
.mod h3{font-size:19px;margin-bottom:8px}
.mod p{font-size:15.5px;color:var(--ink-mute);line-height:1.62}
@media(min-width:860px){
.mods{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
}
.format{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:44px}
.fbox{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:26px 24px;text-align:center}
.fbox .n{font-family:var(--f-head);font-size:30px;font-weight:500;color:var(--petrol);display:block;line-height:1}
.fbox .t{font-size:14.5px;color:var(--ink-mute);margin-top:10px;display:block;line-height:1.5}
@media(min-width:760px){
.format{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.results{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:40px;max-width:760px}
.results li{display:flex;gap:14px;align-items:flex-start;font-size:16.5px;
  color:var(--ink-body);line-height:1.55;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r);padding:18px 22px}
.results .ck{flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:var(--gold-pale);
  display:grid;place-items:center;margin-top:1px}
.results .ck svg{width:12px;height:12px;color:var(--petrol)}
.on-petrol .results,.on-berry .results{max-width:820px}
.on-petrol .results li,.on-berry .results li{background:rgba(245,243,238,.08);
  border-color:var(--line-inv);color:var(--on-dark)}
.on-petrol .results .ck,.on-berry .results .ck{background:var(--gold-light)}
.on-petrol .results .ck svg,.on-berry .results .ck svg{color:var(--petrol-dark)}
.guide-dialog{border:0;padding:0;margin:auto;max-width:900px;
  width:calc(100% - 2 * var(--pad));max-height:calc(100dvh - 32px);overflow:auto;
  border-radius:var(--r-lg);background:var(--white);box-shadow:0 24px 70px rgba(0,0,0,.34)}
.guide-dialog::backdrop{background:rgba(0,52,62,.62)}
.guide-zu{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;
  display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);
  background:var(--white);color:var(--ink-body);cursor:pointer}
.guide-zu:hover{background:var(--bg-2);color:var(--petrol)}
.guide-zu svg{width:17px;height:17px}
.guide-in{display:grid;grid-template-columns:minmax(0,1fr)}
.guide-bild{background:var(--bg-3);display:none}
.guide-bild img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.guide-text{padding:34px 26px 30px}
.guide-text h2{font-size:clamp(22px,2.6vw,29px);margin:10px 0 6px}
.guide-unter{font-family:var(--f-head);font-size:16px;color:var(--gold-ink);
  margin-bottom:18px}
.guide-text p{font-size:15.5px;line-height:1.68;color:var(--ink-mute);margin-bottom:14px}
.guide-liste-titel{margin-bottom:10px !important;color:var(--ink-body) !important}
.guide-liste{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;margin-bottom:16px}
.guide-liste li{font-size:15px;line-height:1.55;color:var(--ink-body);
  padding-left:24px;position:relative}
.guide-liste li::before{content:'';position:absolute;left:2px;top:7px;width:9px;height:5px;
  border-left:1.6px solid var(--gold);border-bottom:1.6px solid var(--gold);
  transform:rotate(-45deg)}
.guide-satz{font-family:var(--f-head);font-size:17px !important;line-height:1.45 !important;
  color:var(--berry) !important;border-left:2px solid var(--gold);padding-left:18px;
  margin:20px 0 24px !important}
.guide-form{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.guide-reihe{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.guide-feld{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;min-width:0}
.guide-feld label{font-size:13.5px;font-weight:500;color:var(--ink-body)}
.guide-feld input{width:100%;padding:13px 15px;border-radius:var(--r);
  border:1.5px solid var(--line-strong);background:var(--bg);color:var(--ink);
  font-family:var(--f-text);font-size:15.5px;line-height:1.5}
.guide-feld input:focus{outline:none;border-color:var(--petrol);background:var(--white);
  box-shadow:0 0 0 3px rgba(0,75,88,.10)}
.guide-note{font-size:13px !important;line-height:1.6 !important;
  color:var(--ink-mute) !important;margin:0 !important;text-align:center}
.guide-form .form-fertig,.guide-text .form-fertig{padding-top:4px}
@media(min-width:720px){
.guide-reihe{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.guide-in{grid-template-columns:minmax(0,.42fr) minmax(0,.58fr)}
.guide-bild{display:block}
.guide-text{padding:40px 38px 36px}
}
.ck-handlung{background:var(--bg-2);border-left:3px solid var(--gold);
  border-radius:0 var(--r) var(--r) 0;padding:18px 20px 16px;margin-top:4px}
.ck-handlung p{margin-bottom:10px}
.ck-handlung p:last-child{margin-bottom:0}
.on-petrol .mod .no,.on-petrol .lever .no,.on-petrol .fbox .n,.on-petrol .wl-form .ck-consent a,.lead-offer .ck-consent a{color:var(--gold-karte)}
.modi{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:44px}
.modus{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 28px 26px;border-top:3px solid var(--gold)}
.modus h3{font-size:20px;margin-bottom:12px}
.modus p{font-size:15.5px;line-height:1.66;color:var(--ink-mute);margin-bottom:12px}
.modus p:last-child{margin-bottom:0}
@media(min-width:820px){
.modi{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
}
.einschub{background:var(--gold-pale);border-radius:var(--r-lg);
  padding:34px 28px;margin-top:48px}
.einschub h3{font-size:clamp(20px,2.2vw,25px);margin-bottom:14px}
.einschub p{font-size:15.5px;line-height:1.68;color:var(--ink-body);margin-bottom:13px}
.einschub p:last-child{margin-bottom:0}
.einschub .pull{color:var(--berry);border-left-color:var(--petrol)}
@media(min-width:820px){
.einschub{padding:44px 46px}
}
.spezial{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-top:34px}
.spez{background:var(--bg-2);border:1px dashed var(--gold-kante);border-radius:var(--r);
  padding:26px 24px 22px}
.spez h3{font-size:18px;margin-bottom:10px}
.spez p{font-size:15px;line-height:1.65;color:var(--ink-mute);margin-bottom:11px}
.spez p:last-child{margin-bottom:0}
.spez .zahl{font-size:13.5px;line-height:1.62;color:var(--ink-body);
  border-top:1px solid var(--line);padding-top:13px;margin-top:15px}
@media(min-width:860px){
.spezial{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
}
.frei{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:40px}
.freibox{background:var(--white);border:1px solid var(--gold-kante);
  border-radius:var(--r-lg);padding:30px 28px 26px;display:flex;flex-direction:column}
.freibox .lbl{display:inline-block;align-self:flex-start;font-family:var(--f-nav);
  font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-ink-grau);background:var(--bg-2);padding:5px 12px;border-radius:99px;
  margin-bottom:16px}
.freibox h3{font-size:20px;margin-bottom:12px}
.freibox p{font-size:15.5px;line-height:1.66;color:var(--ink-mute);margin-bottom:13px}
.freibox ul{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;margin-bottom:16px}
.freibox li{font-size:15px;line-height:1.55;color:var(--ink-body);
  padding-left:24px;position:relative}
.freibox li::before{content:'';position:absolute;left:2px;top:7px;width:9px;height:5px;
  border-left:1.6px solid var(--gold);border-bottom:1.6px solid var(--gold);
  transform:rotate(-45deg)}
.freibox .hinweis{font-size:13.5px;color:var(--gold-ink);margin:0 0 18px}
.freibox .btn{margin-top:auto}
@media(min-width:860px){
.frei{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}
}
.wege{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:40px}
.weg{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:30px 26px 26px;display:flex;flex-direction:column}
.weg .lbl{display:block;font-family:var(--f-nav);font-size:11px;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:14px}
.weg h3{font-size:19px;margin-bottom:11px}
.weg p{font-size:15px;line-height:1.65;color:var(--ink-mute);margin-bottom:20px;flex:1}
.weg .note{font-size:13px;color:var(--ink-mute);margin-top:11px}
.weg .weiter{display:inline-block;margin-top:13px;font-size:14.5px;color:var(--petrol);
  text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.weg .weiter:hover{color:var(--berry)}
@media(min-width:860px){
.wege{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
}
@media(min-width:640px) and (max-width:859px){
.wege{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.werte{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-top:40px}
.wert{background:var(--white);border:1px solid var(--line);border-radius:var(--r);
  padding:24px 22px 21px;border-top:2px solid var(--gold-kante)}
.wert b{display:block;font-family:var(--f-nav);font-size:11.5px;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--petrol);margin-bottom:10px}
.wert span{display:block;font-size:15px;line-height:1.65;color:var(--ink-mute)}
@media(min-width:700px){
.werte{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
}
@media(min-width:1000px){
.werte{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.wende{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:center}
.wende-bild{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow);
  background:var(--bg-3)}
.wende-bild img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.wende-zitat{font-family:var(--f-head);font-size:clamp(22px,2.7vw,31px);font-weight:400;
  line-height:1.34;color:var(--petrol);border-left:3px solid var(--gold);
  padding-left:24px;margin-bottom:26px}
.wende p{font-size:16px;line-height:1.72;color:var(--ink-body);margin-bottom:15px}
.wende-frage{font-family:var(--f-head);font-size:clamp(19px,2.1vw,24px) !important;
  line-height:1.42 !important;color:var(--berry) !important;
  background:var(--gold-pale);border-radius:var(--r);padding:22px 24px;
  margin:26px 0 22px !important}
@media(min-width:900px){
.wende{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:56px}
}
.quelle-fuss{font-size:13px;line-height:1.6;color:var(--ink-mute);margin-top:22px}
.quelle-fuss a{color:var(--petrol);text-decoration:underline;
  text-decoration-color:var(--gold);text-underline-offset:3px}
.quelle-fuss a:hover{color:var(--berry)}
.form-fertig{display:grid;grid-template-columns:minmax(0,1fr);gap:4px}
.form-fertig .btn{margin-top:14px}
.form-fertig .weiter{display:inline-block;margin-top:12px;font-size:14.5px}
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
:where(.elementor-widget-html),:where(.elementor-widget-html) *,:where(.elementor-widget-html)::before,:where(.elementor-widget-html) *::before,:where(.elementor-widget-html)::after,:where(.elementor-widget-html) *::after{animation:none!important;transition:none!important}
.rv{opacity:1;transform:none}
html{scroll-behavior:auto}
}
@media(max-width:1039px){
:root{--sec:72px;--pad:20px}
body{font-size:16px}
.hero{padding:52px 0 64px}
.hero-cta .btn{flex:1 1 100%}
.hero-figure .sig{width:70px;height:70px;left:-8px;bottom:-8px}
.shift-col{padding:28px 24px}
.check-card{padding:28px 22px 26px}
.cta-card{padding:28px 24px}
.head .brand>span>span{display:none}
}

/* ============ ANPASSUNG AN ELEMENTORS CONTAINER ============

   Elementor stellt jeden Container voreingestellt auf "Boxed", also auf
   1140 Pixel Breite mit 10 Pixeln Innenabstand. Unser Entwurf regelt die
   Breite selbst: .wrap begrenzt den Text auf 1200 Pixel, und randlose
   Abschnitte wie das Zahlenband, der Goldbalken oder das Meerband gehen
   bewusst ueber die volle Fensterbreite.

   Mit Elementors Voreinstellung waere beides zu schmal, die Ueberschrift
   im Kopfbereich braeche eine Zeile frueher um, und die randlosen Baender
   saessen eingerueckt in der Seite statt an ihrem Rand.

   Diese Regel nimmt die Begrenzung genau dort zurueck, wo unser eigener
   Inhalt steht, also nur bei Containern, die einen HTML-Baustein tragen.
   Kopfzeile, Fusszeile und jeder Baustein, den Sina spaeter selbst setzt,
   bleiben unberuehrt.

   Der Import stellt dieselben Container zusaetzlich direkt auf volle
   Breite, siehe tools/elementor_export.py. Diese Regel greift also auch
   dann noch, wenn eine Seite vor dieser Aenderung importiert wurde. */
   Genannt sind beide Bauformen: der Container auf voller Breite traegt den
   Baustein direkt, der voreingestellte "boxed" schiebt noch ein .e-con-inner
   dazwischen. Seiten, die vor der Umstellung importiert wurden, haben die
   zweite Form, deshalb stehen beide hier. */
.e-con:has(> .elementor-widget-html),
.e-con:has(> .e-con-inner > .elementor-widget-html),
.e-con-inner:has(> .elementor-widget-html){max-width:none;padding:0}

/* ============ GEGENRESET ZU HELLO ELEMENTOR ============

   Das Theme Hello Elementor bringt ein eigenes reset.css mit, das Abstaende
   und Knopfform selbst festlegt, zum Beispiel

     p{margin-block-end:.9rem}
     h1,h2,h3,h4,h5,h6{margin-block-start:.5rem;margin-block-end:1rem}
     button{padding:.5rem 1rem;border:1px solid #c36;white-space:nowrap}

   Unser eigener Grundreset steht als *{margin:0;padding:0}. Der Stern
   zaehlt bei der Spezifitaet aber als null, ein blanker Elementname als
   eins, also gewinnt Hello, und unsere Abschnitte bekommen Abstaende, die
   der Entwurf nicht hat. Sichtbar wurde das als zu hohe Seiten und als
   Knopf, dessen Beschriftung nicht umbrach und seitlich herauslief.

   Diese Regeln nennen dieselben Elemente noch einmal, also auf derselben
   Stufe wie Hello, und stehen spaeter. Damit gilt wieder der Entwurf.
   Eigene Klassen wie .btn liegen weiterhin darueber und bleiben in Kraft. */
:where(.elementor-widget-html) p,
:where(.elementor-widget-html) h1,:where(.elementor-widget-html) h2,
:where(.elementor-widget-html) h3,:where(.elementor-widget-html) h4,
:where(.elementor-widget-html) h5,:where(.elementor-widget-html) h6,
:where(.elementor-widget-html) ul,:where(.elementor-widget-html) ol,
:where(.elementor-widget-html) li,:where(.elementor-widget-html) dl,
:where(.elementor-widget-html) dd,:where(.elementor-widget-html) dt,
:where(.elementor-widget-html) figure,:where(.elementor-widget-html) blockquote,
:where(.elementor-widget-html) fieldset,:where(.elementor-widget-html) legend,
:where(.elementor-widget-html) table{margin:0;padding:0}
/* Knoepfe brauchen eine Stufe mehr. Hello spricht sie auch ueber
   [type="submit"] an, und ein Attributselektor wiegt schwerer als ein
   blanker Elementname. Genannt sind hier genau die drei Eigenschaften, die
   ein Vergleich der berechneten Stile zwischen Entwurf und WordPress als
   abweichend gezeigt hat, nicht mehr. Alles andere am Knopf regelt .btn
   aus dem Entwurf und bleibt unangetastet.

   Sichtbar war vor allem white-space: der Knopf "Messeangebot
   unverbindlich anfragen" brach auf dem Telefon nicht um und schob die
   ganze Seite 59 Pixel zur Seite. */
.elementor-widget-html button{
  white-space:normal;-webkit-appearance:none;appearance:none;
  -webkit-user-select:auto;user-select:auto}
