/* Neue Wege – Andrea Toifl. Nachbau von neuewege.coach (Stand 29.09.2026), Maße und Farben vom Original. */

/* Das Original legt Poppins unter verschobenen Gewichten ab: 400 zeigt den
   Medium-, 600 den Bold-Schnitt. So bleibt es, sonst wirkt alles dünner. */
@font-face{font-family:"Poppins";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/poppins-light-latin.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}
@font-face{font-family:"Poppins";font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/poppins-light-latin-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:"Poppins";font-style:normal;font-weight:400 500;font-display:swap;src:url(../fonts/poppins-medium-latin.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}
@font-face{font-family:"Poppins";font-style:normal;font-weight:400 500;font-display:swap;src:url(../fonts/poppins-medium-latin-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:"Poppins";font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/poppins-bold-latin.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}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/poppins-bold-latin-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:"PT Serif";font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/ptserif-bold-latin.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}
@font-face{font-family:"PT Serif";font-style:normal;font-weight:600 700;font-display:swap;src:url(../fonts/ptserif-bold-latin-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}

:root{
  --dunkel:#443c3c;
  --hell:#f1eae2;
  --gold:#b37d36;
  --kasten:#cfc1b3;
  --poppins:"Poppins",sans-serif;
  /* Im Original angegeben, aber nicht geladen: Es erscheint die Systemschrift. */
  --system:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:clip;background:#fff;color:var(--dunkel);font-family:var(--poppins);font-size:16px;line-height:1.5;font-weight:400;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold)}
h1,h2,h3,p,ul{margin:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 10px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Knöpfe ---------- */
/* Wie im Original (Elementor „grow“): beim Drüberfahren 110 %, hell mit dunkler Schrift. */
.knopf{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--gold);color:var(--hell);font:500 18px/1 var(--poppins);padding:25px 50px;border-radius:50px;text-decoration:none;text-align:center;transition:all .3s}
.knopf:hover,.knopf:focus-visible,.knopf:active{transform:scale(1.1);background:var(--hell);color:var(--dunkel)}
.knopf svg{width:.7em;height:.7em;fill:currentColor}

/* ---------- Kopf ---------- */
.kopf{position:absolute;top:0;left:0;right:0;z-index:20}
.kopf .wrap{display:flex;align-items:center;justify-content:space-between;min-height:76px}
.nav{display:flex;gap:15px;list-style:none;padding:0}
.nav a{display:block;padding:4px 10px;font:600 16px/20px var(--system);color:var(--hell);text-decoration:none}
.nav a:hover{text-decoration:underline}
.kopf .knopf{font-size:16px;padding:20px 40px;text-transform:capitalize}
.kopf .knopf svg{width:14px;height:14px}
.kopf .knopf:hover,.kopf .knopf:focus-visible,.kopf .knopf:active{background:var(--gold);color:var(--dunkel)}
.menu-knopf{display:none;background:none;border:1px solid var(--hell);color:var(--hell);width:35px;height:35px;padding:5px;cursor:pointer}
.menu-knopf svg{width:100%;height:100%;fill:currentColor}
.seite-hell .nav a{color:var(--dunkel)}
.seite-hell .menu-knopf{color:var(--dunkel);border-color:var(--dunkel)}

/* ---------- Aufmacher ---------- */
.aufmacher{position:relative;background:var(--dunkel);min-height:620px;padding:150px 0 130px}
.aufmacher .wrap{display:grid;grid-template-columns:274px 1fr;gap:70px;align-items:start;position:relative;z-index:3}
.portrait{width:274px;height:320px;border-radius:20px;background:var(--hell) url(../img/andrea.webp) -160px 0/cover no-repeat}
.aufmacher .text{padding-top:33px}
.aufmacher .unter{font:300 24px/1.35 var(--poppins);letter-spacing:1px;color:var(--hell);margin-bottom:13px}
.aufmacher h1{font:600 50px/60px var(--poppins);color:var(--hell);margin-bottom:20px}
.aufmacher .blatt{position:absolute;left:177px;top:129px;width:225px;z-index:3;pointer-events:none}
.welle{position:absolute;left:0;right:0;overflow:hidden;line-height:0;pointer-events:none;z-index:2}
.welle svg{position:relative;left:50%;transform:translateX(-50%);display:block}
.welle path{fill:var(--hell)}
.welle-unten{bottom:-1px;transform:rotate(180deg)}
.welle-unten svg{width:calc(120% + 1.3px);height:80px}
.welle-oben{top:-1px}
.welle-oben svg{width:calc(100% + 1.3px);height:70px}

/* ---------- Gemeinsames ---------- */
.hell{background:var(--hell)}
.dunkel{background:var(--dunkel);color:var(--hell)}
.augenbraue{font:400 16px/1 var(--poppins);text-transform:uppercase}
.strich{width:105px;height:1px;background:var(--dunkel);margin:10px 0 30px}
h2.gross{font:400 40px/44px var(--poppins);letter-spacing:-2.2px}
.titel-kreis{display:flex;align-items:center;gap:20px;margin:20px 0}
.titel-kreis::before{content:"";flex:0 0 50px;height:50px;border-radius:50%;background:var(--gold)}
.fliess p{font-weight:300;line-height:1.4}
.fliess p+p{margin-top:14px}

/* ---------- Was ist Dein Weg? ---------- */
.weg{padding-top:50px}
.weg .einleitung p{line-height:24px}
.weg .einleitung p+p{margin-top:14px}
.weg h2{margin:20px 0}
.karten{display:grid;grid-template-columns:repeat(4,1fr);gap:31px;margin:20px 0 80px}
.karte{background:var(--dunkel);color:var(--hell);border-radius:20px;box-shadow:5px 5px 10px rgba(0,0,0,.5);padding:20px 20px 30px;text-align:center;min-height:313px}
.karte svg{width:30px;height:30px;fill:#fff;margin:0 auto 8px}
.karte h3{font:600 18px/27px var(--poppins);color:#fff;margin-bottom:12px}
.karte p{font-size:16px;line-height:24px}
.zitat{position:relative;border-radius:50px 50px 0 0;min-height:270px;display:flex;align-items:center;justify-content:center;padding:40px 20%;background:url(../img/waldweg1.webp) center/cover;overflow:hidden}
.zitat::before{content:"";position:absolute;inset:0;background:var(--dunkel);opacity:.7}
.zitat p{position:relative;font:400 40px/44px var(--poppins);letter-spacing:-2.2px;color:var(--hell);text-align:center}

/* ---------- Dein Weg zum Selbst ---------- */
.selbst{padding:130px 0 60px;position:relative;overflow:hidden}
.selbst .wrap{display:grid;grid-template-columns:373px 1fr;gap:20px;position:relative}
.selbst .links{position:relative;z-index:1}
.selbst .fliess{margin-bottom:36px}
.selbst .fliess p{color:var(--hell)}
.selbst .blatt{position:absolute;left:196px;top:294px;width:225px;z-index:-1;pointer-events:none}
.kurs{padding-left:75px}
.kurs .punkt{padding:36px 77px 36px 37px;border-top:2px solid var(--hell)}
.kurs .punkt:first-child{border-top:0;padding-top:12px}
.kurs h3{font:600 28px/30.8px var(--poppins);margin-bottom:14px}
.kurs p{font-weight:300;line-height:24px}

/* ---------- Über mich ---------- */
.ueber{padding:100px 0 80px;position:relative;overflow:hidden}
.ueber-kopf{display:grid;grid-template-columns:684px 1fr;gap:91px;align-items:start}
.ueber-kopf .fliess p{color:var(--dunkel)}
.ueber-kopf .linie{width:410px;height:2px;background:var(--dunkel);margin-top:30px}
.ueber-bild{height:420px;border-radius:20px;background:var(--kasten) url(../img/andrea.webp) center 20%/cover no-repeat}
.eigenschaften{display:grid;grid-template-columns:repeat(3,1fr);gap:77px 57px;margin-top:80px;position:relative}
.eigenschaft{background:var(--dunkel);color:#fff;border-radius:20px;box-shadow:5px 5px 10px rgba(0,0,0,.5);padding:45.6px 22.8px;text-align:center;min-height:325px;display:flex;flex-direction:column;align-items:center;position:relative;z-index:1}
.eigenschaft h3{font:600 20px/24px var(--poppins);margin-bottom:16px}
.eigenschaft p{font-weight:300;line-height:24px;margin-bottom:24px}
.eigenschaft a{font:italic 400 16px/1 var(--poppins);text-transform:uppercase;color:var(--gold);text-decoration:underline;margin-top:auto;padding-bottom:12px;transition:all .3s}
.eigenschaft a:hover,.eigenschaft a:focus-visible,.eigenschaft a:active{transform:scale(1.1);color:#cec1b2}
.ueber .blatt{position:absolute;left:calc(50% + 57px);bottom:-49px;width:225px;z-index:0;pointer-events:none}

/* ---------- Wendepunkt ---------- */
.wendepunkt{padding:50px 0}
.wendepunkt .wrap{display:grid;grid-template-columns:471px 1fr;gap:20px;align-items:center}
.wendepunkt .fliess{margin-bottom:36px}
.wendepunkt .fliess p{color:var(--hell)}
.schritte{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;grid-auto-flow:column;gap:0 21px}
.schritt{padding-bottom:40px}
.schritt .nr{display:flex;align-items:center;gap:30px;font:600 24px/31.2px var(--poppins);color:var(--gold);height:61px}
.schritt .nr::after{content:"";width:170px;height:2px;background:var(--hell)}
.schritt h3{font:600 24px/28.8px var(--poppins);margin:20px 0 20px}
.schritt p{font-weight:300;line-height:24px}

/* ---------- Was zeichnet mich aus ---------- */
.auszeichnung{padding:71px 0}
.auszeichnung .wrap{display:grid;grid-template-columns:448px 1fr;gap:77px;align-items:center}
.auszeichnung h2{font:600 40px/48px var(--system);margin-bottom:20px}
.auszeichnung ul{padding-left:40px;font-weight:300;line-height:24px}

/* ---------- Big Five und Fragen ---------- */
.bigfive{padding:81px 0 80px}
.bigfive-oben{display:grid;grid-template-columns:741px 1fr;gap:57px;align-items:start}
.bigfive-oben h2{font:600 40px/48px var(--system);text-transform:capitalize;margin-bottom:20px}
.haken{list-style:none;padding:0;margin-bottom:20px}
.haken li{display:grid;grid-template-columns:14px 1fr;gap:44px;align-items:center;color:#000;line-height:24px;padding:7px 0 8px}
.haken li::before{content:"";width:14px;height:14px;background:var(--dunkel)}
.bigfive .fliess{margin-bottom:20px}
.bigfive-bild{border-radius:20px;width:342px;height:450px;object-fit:cover}
.fragen{margin-top:58px}
.fragen h2{font:600 32px/32px var(--poppins);margin-bottom:30px}
.frage{border-bottom:1px solid #d5d8dc}
.frage summary{list-style:none;cursor:pointer;display:flex;gap:10px;align-items:baseline;padding:15px;font:600 16px/1.45 var(--poppins);text-decoration:underline;color:var(--dunkel)}
.frage summary::-webkit-details-marker{display:none}
.frage summary::before{content:"";flex:0 0 6px;height:10px;background:var(--dunkel);clip-path:polygon(0 0,100% 50%,0 100%);transition:transform .2s}
.frage[open] summary::before{transform:rotate(90deg)}
.frage .antwort{padding:0 15px 15px 31px;font-weight:300;line-height:24px}
.frage .antwort p+p,.frage .antwort p+ul,.frage .antwort ul+p{margin-top:10px}
.frage .antwort ul{padding-left:22px}

/* ---------- Kundenstimmen ---------- */
.stimmen{padding:80px 0 120px;text-align:center}
.stimmen h2{font:600 44.64px/49.1px "PT Serif",serif;letter-spacing:-.28px}
.stimmen .unterzeile{font:500 24px/31.2px var(--system);letter-spacing:-.13px;margin-top:10px}
.karussell{position:relative;margin-top:40px;padding:0 60px}
.stimme{margin:0;display:none;grid-template-columns:170px 1fr;gap:50px;text-align:left;align-items:start;padding:17px 0 0 15px}
.stimme.an{display:grid;animation:einblenden .5s}
@keyframes einblenden{from{opacity:0}}
.stimme img{width:170px;height:170px;border-radius:999px;object-fit:cover}
.stimme blockquote{margin:0}
.stimme blockquote p{font:italic 300 18px/27px var(--poppins)}
.stimme cite{display:block;font:italic 600 24px/36px var(--poppins);margin-top:30px}
.stimme a{color:inherit}
.pfeil{position:absolute;top:50%;transform:translateY(-50%);background:none;border:0;padding:10px;cursor:pointer;color:var(--dunkel)}
.pfeil svg{width:12px;height:20px;fill:currentColor;display:block}
.pfeil.zurueck{left:12px}
.pfeil.vor{right:12px}

/* ---------- Kontakt und Fuß ---------- */
.kontakt{position:relative;color:var(--hell);background:url(../img/waldweg2.webp) center/cover;padding:calc(20% - 40px) 0 72px}
.kontakt::before{content:"";position:absolute;inset:0;background:var(--dunkel);opacity:.9}
.kontakt .wrap{position:relative;z-index:1}
.kontakt-kurz{padding:150px 0 60px}
.kontakt-kurz .fuss-spalten{margin-top:0}
.kontakt h2{font:600 32px/38.4px var(--poppins);text-align:center;margin-bottom:20px}
.formular{max-width:753px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:40px 37px}
.formular label{display:block}
.formular input,.formular textarea{width:100%;background:transparent;border:0;border-bottom:1px solid var(--gold);border-radius:0;color:#fff;font:400 15px/21px var(--poppins);padding:8px 16px}
.formular textarea{height:95px;resize:vertical}
.formular ::placeholder{color:var(--hell);opacity:.8}
.formular .breit{grid-column:1/-1}
.formular .unten{grid-column:1/-1;display:flex;justify-content:flex-end;align-items:center;gap:20px;margin-top:0}
.formular button{background:var(--gold);color:#fff;border:0;border-radius:60px;padding:20px 50px;font:500 16px/1 var(--poppins);cursor:pointer;transition:all .3s}
.formular button:hover,.formular button:focus-visible,.formular button:active{transform:scale(1.1);background:var(--hell);color:#212121}
.formular .form-status{flex:1;font-size:15px}
.fuss-spalten{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:50px}
.fuss-spalten h3{font:600 24px/28.8px var(--poppins);margin-bottom:14px}
.fuss-spalten p{font-weight:300;line-height:24px}
.fuss-spalten a{color:var(--gold);font-weight:400;display:inline-block}
footer.unten-leiste{background:#000;color:#fff;text-align:center;padding:28px 10px;font:300 16px/24px var(--poppins)}
footer.unten-leiste a{color:#fff}

/* ---------- Rechtstexte ---------- */
.seite-hell{background:var(--hell)}
.seite-hell .kopf{position:static}
.recht{padding:30px 0 80px;color:var(--dunkel)}
.recht h1{font:400 40px/1.2 var(--poppins);margin-bottom:20px}
.recht h2{font:600 26px/1.3 var(--poppins);margin:30px 0 12px}
.recht h3{font:600 20px/1.3 var(--poppins);margin:24px 0 10px}
.recht h4{font:600 16px/1.4 var(--poppins);margin:18px 0 8px}
.recht p,.recht li{line-height:24px}
.recht p{margin-bottom:14px}
.recht ul{padding-left:22px;margin-bottom:14px}
.recht{overflow-wrap:anywhere}
.recht a{word-break:break-word}

/* ---------- Einblenden ---------- */
.js .rv{opacity:0;transform:translateY(40px);transition:opacity 1s ease,transform 1s ease}
.js .rv.von-links{transform:translateX(-60px)}
.js .rv.von-rechts{transform:translateX(60px)}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}.knopf:hover,.knopf:focus-visible,.eigenschaft a:hover,.formular button:hover{transform:none}html{scroll-behavior:auto}}

/* ---------- Tablet ---------- */
@media (max-width:1024px){
  .aufmacher .wrap{grid-template-columns:274px 1fr;gap:40px}
  .aufmacher h1{font-size:40px;line-height:48px}
  .karten{grid-template-columns:repeat(2,1fr)}
  .selbst .wrap,.wendepunkt .wrap,.ueber-kopf,.bigfive-oben,.auszeichnung .wrap{grid-template-columns:1fr}
  .kurs{padding-left:0;margin-top:40px}
  .ueber-kopf .linie{width:60%}
  .eigenschaften{grid-template-columns:repeat(2,1fr);gap:40px}
  .schritte{margin-top:40px}
  .bigfive-bild{width:100%;height:450px}
  .zitat{padding:40px 10%}
}

/* ---------- Handy ---------- */
@media (max-width:767px){
  .wrap{padding:0 20px}
  .js .rv.von-links,.js .rv.von-rechts{transform:translateY(40px)}
  .kopf .wrap{flex-direction:column;justify-content:flex-start;gap:20px;padding-top:30px}
  .kopf .knopf{letter-spacing:2px;padding:15px 30px}
  .menu-knopf{display:block;margin:0 auto}
  .kopf .knopf{order:-1}
  .nav{display:none;position:absolute;top:141px;left:0;right:0;flex-direction:column;gap:0;background:var(--dunkel);padding:10px 0;margin:0}
  .nav.offen{display:flex}
  .nav a{padding:12px 20px;text-align:center}
  .seite-hell .nav{background:var(--hell)}
  .seite-hell .kopf{position:relative}
  .aufmacher{padding:200px 0 100px}
  .aufmacher .wrap{grid-template-columns:1fr;gap:0}
  .portrait{width:100%;height:320px;background-position:-145px 0}
  .aufmacher .text{padding-top:25px}
  .aufmacher .unter{font-size:16px;line-height:23px;margin-bottom:16px}
  .aufmacher h1{font-size:24px;line-height:28.8px;margin-bottom:20px}
  .aufmacher .knopf{width:100%;letter-spacing:2px;padding:15px 30px}
  .aufmacher .blatt{left:10px;top:270px;z-index:1}
  .portrait{position:relative;z-index:0}
  .aufmacher .text{position:relative;z-index:2}
  .knopf{letter-spacing:2px;padding:15px 30px}
  .weg{padding-top:35px}
  h2.gross{font-size:30px;line-height:36px}
  .karten{grid-template-columns:1fr;gap:40px}
  .zitat{padding:30px 17.5px;min-height:253px}
  .zitat p{font-size:24px;line-height:28.8px}
  .selbst{padding:80px 0 40px}
  .selbst .blatt{left:40px;top:auto;bottom:-200px}
  .kurs .punkt{padding:30px 0}
  .kurs h3{font-size:20px;line-height:22px}
  .ueber{padding:60px 0}
  .ueber-kopf{gap:40px}
  .ueber-kopf .linie{width:100%}
  .eigenschaften{grid-template-columns:1fr;gap:64px}
  .eigenschaft{padding:35px;min-height:0}
  .eigenschaft h3{font-size:22px;line-height:26.4px}
  .wendepunkt .fliess{margin-bottom:30px}
  .schritte{grid-template-columns:1fr;grid-auto-flow:row;padding-left:19px}
  .schritt .nr{font-size:28px}
  .schritt h3{font-size:20px;line-height:24px}
  .auszeichnung{padding:50px 0}
  .auszeichnung .wrap{gap:40px}
  .auszeichnung h2,.bigfive-oben h2{font-size:28px;line-height:30.8px}
  .haken li{gap:30px}
  .bigfive .knopf{width:100%}
  .bigfive-bild{height:300px}
  .stimmen h2{font-size:32px;line-height:35.2px;letter-spacing:0}
  .stimmen .unterzeile{font-size:20px;line-height:26px}
  .karussell{padding:0 30px}
  .stimme{grid-template-columns:50px 1fr;gap:15px;padding:0}
  .stimme img{width:50px;height:50px;margin:0}
  .stimme blockquote p{font-size:16px;line-height:24px}
  .pfeil.zurueck{left:-8px}
  .pfeil.vor{right:-8px}
  .kontakt{padding:calc(40% - 30px) 0 40px}
  .kontakt-kurz{padding:110px 0 40px}
  .kontakt h2{margin-bottom:30px}
  .formular{grid-template-columns:1fr;gap:30px}
  .formular .unten{flex-direction:column;align-items:center}
  .formular button{font-size:14px;letter-spacing:2px}
  .fuss-spalten{grid-template-columns:1fr;text-align:center;gap:30px}
  .fuss-spalten h3{font-size:20px;line-height:24px}
  footer.unten-leiste{font-size:14px;line-height:21px}
  .recht h1{font-size:32px}
}