@font-face{font-family:'Jost';font-style:normal;font-weight:300 600;font-display:swap;src:url(schrift-jost.woff2?v=180347d9) format('woff2')}@font-face{font-family:'Inter';font-style:normal;font-weight:200 600;font-display:swap;src:url(schrift-inter.woff2?v=1dc044f4) format('woff2')}@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 500;font-display:swap;src:url(schrift-playfair.woff2?v=613a720f) format('woff2')}
:root{
  --ink:#10161B; --paper:#fff; --paper2:#F4F6F7; --line:#DDE3E6;
  --muted:#69757C; --blue:#0098E0; --blue-d:#00699C; --blue-l:#4FC3F7;
  /* Das Hausblau #0098E0 erreicht als Text auf Weiss nur 3,2:1 und als
     Flaeche unter weissem Text ebenfalls. Gefordert sind 4,5:1. Deshalb
     zwei abgeleitete Toene, die nur fuer Text gelten - das Hausblau
     selbst bleibt fuer Flaechen, Linien und Verlaeufe unveraendert.
     --blue-txt auf Weiss: 6,0:1. Weiss auf --blue-flaeche: 4,9:1. */
  --blue-txt:#00699C; --blue-flaeche:#0077B3;
  /* Hausfarbe von vonhelga, nur fuer die Urheberzeile im Fuss */
  --magenta:#D900FF;
  --maxw:1680px;
  --gutter:clamp(24px,5vw,96px);
  --pad:max(var(--gutter), calc((100% - var(--maxw)) / 2));
  --sec:clamp(72px,8vw,152px);
  /* Schriftleiter */
  --fs-hero:clamp(32px,4.9vw,92px);
  --fs-h2:clamp(26px,3.1vw,54px);
  --fs-h3:clamp(19px,1.7vw,26px);
  --fs-body:clamp(15px,1.2vw,20px);
  --fs-lead:clamp(16px,1.3vw,21px);
  --fs-kick:clamp(13px,1.05vw,17px);
  --fs-nav:clamp(13px,1.08vw,18px);
  --fs-btn:clamp(15px,1.2vw,19px);
  --fs-klein:clamp(14px,1.1vw,18px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-gutter:stable;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Inter',system-ui,sans-serif;font-size:var(--fs-body);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* height:auto ist Pflicht, sobald width und height im Tag stehen: sonst
   gilt die Attributhoehe als echte Hoehe und das Bild wird gequetscht.
   Stellen mit eigener Hoehe (Buehne, Kacheln) ueberschreiben das ueber
   ihre Klassenregel. */
img{max-width:100%;height:auto}
a{color:var(--blue);text-decoration:none} a:hover{color:var(--blue-d)}
h1,h2,h3{font-family:'Jost','Futura',system-ui,sans-serif;font-weight:300;margin:0;line-height:1.1}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
p{margin:0}
.kick{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:1.8px;text-transform:uppercase;color:var(--blue-txt);margin:0}
.lead{font-size:var(--fs-lead);color:#3C474E;max-width:62ch}
..btn-platzhalter{}
.btn{overflow-wrap:anywhere;font-family:'Jost',sans-serif;font-size:var(--fs-btn);font-weight:600;letter-spacing:.6px;padding:18px 36px;display:inline-flex;align-items:center;justify-content:center;min-height:60px;border:1px solid transparent;cursor:pointer}
.btn-p{background:var(--blue-flaeche);color:#fff;border-color:var(--blue-flaeche)}
.btn-p:hover{background:var(--blue-d);border-color:var(--blue-d);color:#fff}
.btn-o{border-color:#C6CFD3;color:var(--ink)}
.btn-o:hover{border-color:var(--ink);color:var(--ink)}
.btn-o-hell{border-color:rgba(255,255,255,.65);color:#fff}
.btn-o-hell:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.1)}
.tlink{font-family:'Jost',sans-serif;font-size:var(--fs-btn);font-weight:600;letter-spacing:.8px;color:var(--blue);border-bottom:1px solid var(--blue);padding-bottom:5px;align-self:flex-start;min-height:48px;display:inline-flex;align-items:center}
section{padding:var(--sec) var(--pad)}
/* Luft zwischen Kopfleiste und Abschnittsanfang nach einem Ankersprung.
   Der Wert ist die sichtbare Luft, die Kopfhoehe kommt separat dazu. */
#verkauf,#hausverwaltung,#immobilienvermittlung,#immobilienangebote,#ueber-uns,#kontakt{scroll-margin-top:calc(var(--hh,118px) + clamp(60px,10vw,220px))}

/* Kopfzeile */
.hd{position:fixed;inset:0 0 auto 0;z-index:60;display:flex;align-items:center;gap:clamp(20px,3vw,56px);padding:22px var(--pad);transition:background .25s}
.hd.solid{background:rgba(16,22,27,.85);backdrop-filter:blur(8px)}
.hd img.logo{width:clamp(140px,11vw,190px);aspect-ratio:700/269;height:auto;object-fit:contain;flex-shrink:0}
.hd .aktionen{display:flex;align-items:center;gap:14px;margin-left:auto}
.hd .aktionen .btn{padding:14px 26px;min-height:52px;font-size:var(--fs-nav)}
.burger{display:flex;align-items:center;justify-content:flex-end;gap:12px;background:none;border:0;color:#fff;font-family:'Jost',sans-serif;font-size:var(--fs-nav);font-weight:500;letter-spacing:1.4px;text-transform:uppercase;cursor:pointer;min-height:52px;padding:0 6px;min-width:clamp(152px,11.5vw,188px)}
.burger span{white-space:nowrap}
.burger svg{width:28px;height:16px}
@media(max-width:1280px){.hd .aktionen .btn-o{display:none}}
@media(max-width:760px){.hd .aktionen .btn{display:none}}

/* Overlay */
.ovl{position:fixed;inset:0;z-index:50;background:var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-content:safe center;padding:calc(22px + 96px) var(--pad) 72px;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;overflow-y:auto}
.ovl.auf{opacity:1;visibility:visible}
.ovl .menu{display:flex;flex-direction:column;gap:clamp(10px,1.4vw,22px)}
.ovl .menu a{color:#fff;font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(26px,4.4vw,60px);line-height:1.15}
.ovl .menu a:hover{color:var(--blue-l)}
.ovl .lbl{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#5A6870;margin-bottom:10px}
.ovl .kontakt{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.ovl .kontakt .tel{font-family:'Jost',sans-serif;font-size:clamp(26px,2.9vw,40px);font-weight:400;color:#fff}
.ovl .kontakt p{color:#A7B3B9;font-size:var(--fs-body)}
.ovl .kontakt a.mail,.ovl .kontakt a.adr{color:#A7B3B9;font-size:var(--fs-body);line-height:1.7}
.ovl .kontakt a.mail:hover,.ovl .kontakt a.adr:hover{color:#fff}
@media(max-width:900px){.ovl{grid-template-columns:1fr;padding-top:calc(22px + 84px);align-content:safe center}}

/* Hero */
.hero{position:relative;min-height:clamp(600px,95vh,1120px);display:flex;align-items:flex-end;padding:0;overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .abd{position:absolute;inset:0;background:rgba(10,20,28,.42)}
.hero .vlf{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,20,28,.4) 0%,rgba(10,20,28,0) 42%,rgba(10,20,28,.62) 100%)}
.hero .inhalt{position:relative;padding:0 var(--pad) var(--pad);display:flex;flex-direction:column;gap:clamp(22px,2.6vw,34px);width:100%}
.hero .ort{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:rgba(255,255,255,.92)}
.hero h1{display:flex;flex-direction:column;color:#fff;font-size:var(--fs-hero);line-height:1;text-transform:uppercase}
.hero h1 .a{font-family:'Playfair Display',Georgia,serif;font-weight:400;letter-spacing:.005em}
.hero h1 .b{font-family:'Inter',system-ui,sans-serif;font-weight:200;letter-spacing:-.005em}
.hero .cta{display:flex;flex-wrap:wrap;gap:18px;margin-top:10px}
@media(max-width:760px){
  .hero{min-height:100vh;min-height:100svh;align-items:flex-end;overflow:hidden}
  .hero>img{object-position:50% 50%;transform:none !important}
  .hero .abd{background:rgba(10,20,28,.3)}
  .hero .vlf{background:linear-gradient(180deg,rgba(10,20,28,.45) 0%,rgba(10,20,28,0) 38%,rgba(10,20,28,.82) 100%)}
  .hero .inhalt{padding-bottom:clamp(38px,9vw,56px)}
  .hero h1{font-size:clamp(33px,8.8vw,46px)}
  .hero .ort{letter-spacing:1.6px}
  .hero .cta{gap:12px}
  .hero .cta .btn{width:100%;min-height:50px;padding:12px 18px;line-height:1.25}
}
/* Pfeil nach oben, nur mobil */
.hoch{position:fixed;right:16px;bottom:16px;z-index:55;width:58px;height:58px;display:none;align-items:center;justify-content:center;background:var(--blue);color:#fff;border:0;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s ease}
.hoch.zeig{opacity:1;pointer-events:auto}
.hoch:active{background:var(--blue-d)}
@media(max-width:760px){.hoch{display:flex}}

/* Bausteine */
.zwei{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,110px);align-items:start}
#ueber-uns{align-self:center}
.stack{display:flex;flex-direction:column;gap:26px}
.kennz{background:var(--paper);display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(28px,4vw,56px);padding:clamp(56px,6vw,88px) var(--pad)}
.kennz .z{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(44px,5vw,76px);line-height:1;color:var(--blue)}
.kennz .l{font-family:'Jost',sans-serif;font-size:var(--fs-klein);color:#3C474E;margin-top:6px}
.leist{display:flex;flex-direction:column;gap:var(--sec)}
.leist .zwei{align-items:center}
.leist img{width:100%;display:block}
.wert{background:var(--paper2);align-items:start}
.ueber{background:var(--paper2)}
.wert .stack{gap:clamp(22px,2vw,30px)}
.schritte{list-style:none;margin:clamp(14px,1.6vw,26px) 0 0;padding:0;display:flex;flex-direction:column;gap:clamp(20px,2vw,32px)}
.schritte li{display:flex;gap:clamp(18px,1.8vw,30px);align-items:baseline}
.schritte .nr{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(26px,2.6vw,42px);line-height:1;color:var(--blue);flex-shrink:0;font-variant-numeric:tabular-nums}
.schritte .txt{font-size:var(--fs-lead);color:#3C474E;max-width:34ch}
@media(max-width:900px){.schritte{gap:18px} .schritte li{gap:16px}}
/* Mobil steht der Ablauf direkt ueber dem Knopf: Text, dann 01/02/03, dann handeln.
   Dafuer loesen sich die beiden Spalten auf und die Teile werden neu sortiert. */
@media(max-width:900px){
  .wert.zwei{display:grid;grid-template-columns:1fr;row-gap:clamp(20px,4.4vw,30px)}
  .wert.zwei > .stack{display:contents}
  .wert .kick{order:1}
  .wert h2{order:2}
  .wert .lead{order:3}
  .wert .schritte{order:4;margin-top:clamp(4px,1.4vw,12px)}
  .wert .btn{order:5;justify-self:start;margin-top:clamp(4px,1.4vw,12px)}
}
.angebote{background:var(--paper2);display:flex;flex-direction:column;gap:clamp(36px,5vw,72px)}
.angebote .kopf{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
.raster4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2vw,32px)}
.obj{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.obj img{width:100%;height:clamp(200px,15vw,260px);object-fit:cover;display:block}
.obj-body{padding:clamp(22px,1.8vw,30px);display:flex;flex-direction:column;gap:14px}
.obj .ort{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--blue)}
.obj h3{font-size:clamp(21px,1.6vw,26px)}
.obj .preis{font-family:'Jost',sans-serif;font-size:clamp(23px,1.8vw,30px)}
.fakten{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:16px}
.fakten li{font-family:'Jost',sans-serif;font-size:var(--fs-klein);color:var(--muted)}
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2vw,30px);margin-top:10px}
.person{margin:0;display:flex;flex-direction:column;gap:14px;background:transparent;transition:transform .35s cubic-bezier(.22,.61,.36,1)}
.person .name::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--blue);transition:width .5s cubic-bezier(.22,.61,.36,1)}
.person:hover .name::after{width:100%}
.person:hover{transform:translateY(-4px)}
.person img{transition:box-shadow .35s ease}
.person:hover img{box-shadow:0 16px 34px rgba(16,22,27,.18)}
.person img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.person .name{font-family:'Jost',sans-serif;font-size:clamp(18px,1.35vw,22px);font-weight:500;display:inline-block;position:relative;line-height:1.25;padding-bottom:5px}
.person .rolle{font-size:var(--fs-klein);color:var(--muted);line-height:1.5;display:block;margin-top:9px}
.vertrauen{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.vertrauen li{display:flex;align-items:center;gap:clamp(14px,2.4vw,28px);border-top:1px solid var(--line);padding:26px 0}
.vertrauen img{height:clamp(60px,6vw,92px);width:clamp(76px,8.5vw,132px);object-fit:contain;object-position:center;flex-shrink:0}
.vertrauen .ihk{width:clamp(76px,8.5vw,132px);height:clamp(60px,6vw,92px);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:'Jost',sans-serif;font-size:var(--fs-klein);font-weight:600;color:var(--blue);flex-shrink:0}
.vertrauen .t{font-family:'Jost',sans-serif;font-size:clamp(19px,1.45vw,23px);font-weight:600;display:block}
.vertrauen .s{font-size:var(--fs-klein);color:var(--muted);display:block}
/* Galerie */
.galerie{padding:var(--sec) 0 clamp(56px,6vw,96px);overflow:hidden}
.gal-kopf{padding:0 var(--pad);display:flex;flex-direction:column;gap:18px;max-width:760px}
.spur{margin-top:clamp(40px,5vw,72px);display:flex;gap:clamp(20px,2.4vw,44px);align-items:stretch;padding:0 var(--pad);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;cursor:grab;user-select:none;touch-action:pan-x pan-y}
.spur::-webkit-scrollbar{display:none}
.spur.zieht{cursor:grabbing;scroll-snap-type:none}
.kachel{margin:0;flex:0 0 auto;width:clamp(240px,26vw,440px);scroll-snap-align:center;display:flex;flex-direction:column;gap:14px;transition:transform .45s cubic-bezier(.22,.61,.36,1)}
.kachel.oben{margin-bottom:clamp(36px,4vw,72px)}
.kachel.unten{margin-top:clamp(36px,4vw,72px)}
.rahmen{overflow:hidden;background:var(--paper2);transition:box-shadow .35s ease}
.rahmen img{width:100%;height:clamp(200px,22vw,340px);object-fit:cover;display:block}
.kachel figcaption{display:flex;flex-direction:column;gap:3px}
.k-ort{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--blue-txt)}
.k-adr{font-family:'Jost',sans-serif;font-size:clamp(17px,1.35vw,22px);font-weight:400}
.k-art{font-size:var(--fs-klein);color:var(--muted)}
.kachel:hover{transform:translateY(-6px)}
.kachel:hover .rahmen{box-shadow:0 16px 34px rgba(16,22,27,.18)}
.leiste{margin:clamp(30px,3.5vw,52px) var(--pad) 0;height:2px;background:var(--line);position:relative}
.leiste i{position:absolute;left:0;top:0;height:100%;width:20%;background:var(--blue);transition:width .1s linear,left .1s linear}
.zieh{margin:16px var(--pad) 0;font-family:'Jost',sans-serif;font-size:var(--fs-klein);letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}
@media(max-width:760px){
  .spur{flex-direction:column;overflow-x:visible;cursor:default;gap:clamp(28px,7vw,44px)}
  .kachel{width:100%} .kachel.oben,.kachel.unten{margin:0}
  .kachel.unten{padding-left:clamp(24px,10vw,64px)} .kachel.oben{padding-right:clamp(24px,10vw,64px)}
  .leiste,.zieh{display:none}
}
.stars{position:relative;background:var(--blue-d);color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,110px);align-items:center}
.stars .marke{--ruhe:.42;position:absolute;top:clamp(26px,3.2vw,50px);right:var(--pad);width:clamp(104px,9vw,168px);color:#fff;opacity:var(--ruhe);pointer-events:none}
.stars .marke[data-anim]{opacity:0;transform:none}
.stars .marke[data-anim].sichtbar{animation:flackern 10s linear infinite}
@keyframes flackern{
  0%{opacity:0;filter:none}
  0.5%{opacity:.95;filter:drop-shadow(0 0 7px rgba(255,255,255,.9))}
  0.9%{opacity:.02;filter:none}
  1.4%{opacity:.6;filter:drop-shadow(0 0 5px rgba(255,255,255,.7))}
  1.8%{opacity:0;filter:none}
  2.8%{opacity:1;filter:drop-shadow(0 0 12px rgba(255,255,255,.95))}
  3.3%{opacity:.1;filter:none}
  3.9%{opacity:.9;filter:drop-shadow(0 0 8px rgba(255,255,255,.8))}
  4.4%{opacity:.2;filter:none}
  5.3%{opacity:1;filter:drop-shadow(0 0 10px rgba(255,255,255,.85))}
  5.9%{opacity:.35;filter:none}
  6.9%{opacity:.8;filter:drop-shadow(0 0 6px rgba(255,255,255,.6))}
  7.8%{opacity:.45;filter:none}
  9%{opacity:.7;filter:drop-shadow(0 0 4px rgba(255,255,255,.45))}
  12.5%,100%{opacity:var(--ruhe);filter:none}
}
}
.stars .marke svg{width:100%;height:auto;display:block}
.stars .kick{color:#9FD9F5}
.stars h2{color:#fff}
.stars p.t{color:#DCEEF8;font-size:var(--fs-lead);max-width:60ch}
.stars .zitat{border-left:1px solid rgba(255,255,255,.3);padding-left:clamp(24px,4vw,56px);display:flex;flex-direction:column;gap:22px}
.stars .zitat q{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(23px,2.3vw,34px);line-height:1.35;quotes:'„' '“'}
.stars .zitat .q{font-family:'Jost',sans-serif;font-size:var(--fs-klein);color:#9FD9F5}
.kontaktbl{background:var(--paper2);display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,110px);align-items:center}
.kontaktbl .karte{display:flex;gap:clamp(22px,3vw,44px);align-items:center}
.kontaktbl .karte img{width:clamp(200px,44%,330px);aspect-ratio:230/280;object-fit:cover;flex-shrink:0}
.kontaktbl .tel{font-family:'Jost',sans-serif;font-size:clamp(20px,1.8vw,28px);color:var(--blue);white-space:nowrap}
footer{background:var(--ink);color:#C6CFD3;padding:clamp(64px,7vw,112px) var(--pad) 56px;display:flex;flex-direction:column;gap:clamp(44px,5vw,72px)}
footer .sp{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(28px,4vw,56px)}
/* h3, nicht h4: Vorleseprogramme nutzen die Ueberschriftenstufen zur
   Navigation. Nach einem h2 darf kein h4 folgen, die Stufe dazwischen
   fehlt dann. Die Fusszeilen-Ueberschriften sind echte Ueberschriften
   fuer Linkgruppen, sie gehoeren also nicht zu <p> degradiert. */
footer h3{font-family:'Jost',sans-serif;font-size:var(--fs-kick);font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--blue-l);margin:0 0 10px}
footer a{color:#C6CFD3;display:block;padding:8px 0;font-size:var(--fs-klein)}
footer a:hover{color:#fff}
footer p{font-size:var(--fs-klein)}
footer .unten{display:flex;justify-content:space-between;align-items:baseline;gap:24px;border-top:1px solid #262F36;padding-top:32px;flex-wrap:wrap;font-size:var(--fs-klein);color:#8A959B}
footer .unten nav{display:flex;gap:28px}
footer .macher{margin:0;color:#8A959B}
footer .macher a{display:inline;color:#8A959B;text-decoration:none;border-bottom:1px solid #3A444B;padding:0 0 1px;transition:color .25s,border-color .25s}
footer .macher a:hover,footer .macher a:focus-visible{color:var(--magenta);border-color:var(--magenta)}
@media(max-width:1080px){.raster4{grid-template-columns:repeat(2,1fr)} .kennz{grid-template-columns:repeat(2,1fr)} footer .sp{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.stars .marke{--ruhe:.5;position:static;order:-1;justify-self:center;width:clamp(124px,32vw,180px);margin:0 0 clamp(18px,4vw,30px)} .zwei,.stars,.kontaktbl{grid-template-columns:1fr} .leist .zwei .bild{order:-1} .stars .zitat{border-left:0;border-top:1px solid rgba(255,255,255,.3);padding-left:0;padding-top:26px} .kontaktbl .karte{flex-direction:column;align-items:flex-start} .kontaktbl .karte img{width:min(340px,78%)}}
@media(max-width:640px){.raster4{grid-template-columns:1fr} .team{grid-template-columns:1fr}}
@media(max-width:420px){footer .sp{grid-template-columns:1fr} .kennz{grid-template-columns:1fr}}
/* Bewegung */
.hero>img{transform:translate3d(0,var(--py,0px),0) scale(1.14);will-change:transform}
.bild{overflow:hidden}
.bild img{transform:translate3d(0,var(--py,0px),0) scale(1.1);will-change:transform}
.obj{overflow:hidden;transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s ease}
.obj:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(16,22,27,.16)}
a.obj{color:var(--ink)}
a.obj .obj-body{flex:1}
.obj-mehr{margin-top:auto;padding-top:4px;display:inline-flex;align-items:center;gap:10px;
  font-family:'Jost',sans-serif;font-size:var(--fs-klein);letter-spacing:1.4px;text-transform:uppercase;color:var(--blue)}
.obj-mehr svg{transition:transform .3s ease}
a.obj:hover .obj-mehr svg{transform:translateX(5px)}
.vertrauen li{transition:border-color .3s ease}
.vertrauen li:hover{border-top-color:var(--blue)}
.btn,.tlink,.ovl .menu a,.ovl .kontakt a,footer a{transition:color .25s ease,background-color .25s ease,border-color .25s ease,transform .25s ease}
.tlink:hover{transform:translateX(4px)}
[data-anim]{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,.61,.36,1)}
[data-anim].sichtbar{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero>img,.bild img{transform:none !important}
  [data-anim]{opacity:1 !important;transform:none !important;transition:none}
  .obj,.tlink,.person,.person .name::after,.kachel,.rahmen{transition:none !important}
  .kachel:hover{transform:none}
  .stars .marke[data-anim],.stars .marke[data-anim].sichtbar{animation:none !important;opacity:var(--ruhe) !important;filter:none !important}
  .obj:hover,.person:hover{transform:none}
}
.skip{position:absolute;left:-9999px} .skip:focus{left:var(--gutter);top:12px;z-index:80;background:#fff;padding:14px 22px}