/* =========================================================
   Marco Henchen – ö.b.u.v. Sachverständiger
   Stylesheet · Greige & Anthrazit
   ========================================================= */

/* ---------- Fonts (selbst gehostet, DSGVO-konform) ---------- */
@font-face{font-family:'Poppins';src:url('../fonts/poppins-300.woff2') format('woff2'),url('../fonts/poppins-300.woff') format('woff');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/poppins-400.woff2') format('woff2'),url('../fonts/poppins-400.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('../fonts/poppins-500.woff2') format('woff2'),url('../fonts/poppins-500.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Lora';src:url('../fonts/lora-400.woff2') format('woff2'),url('../fonts/lora-400.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Lora';src:url('../fonts/lora-400i.woff2') format('woff2'),url('../fonts/lora-400i.woff') format('woff');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Lora';src:url('../fonts/lora-600.woff2') format('woff2'),url('../fonts/lora-600.woff') format('woff');font-weight:600;font-style:normal;font-display:swap}

/* ---------- Design Tokens ---------- */
:root{
  --greige-50:#FAF8F4;
  --greige-100:#F2EEE7;
  --greige-200:#E8E2D8;
  --greige-300:#DBD2C4;
  --greige-400:#C4B8A6;
  --greige-500:#A2957F;
  --greige-600:#8C7C63;  /* dunkleres Greige – kontrastsicher fuer Ziffern */

  --ink-900:#22272A;   /* Anthrazit */
  --ink-800:#2E3538;
  --ink-700:#414A4F;
  --ink-600:#525C62;
  --ink-400:#8A9299;

  --line:rgba(34,39,42,.16);
  --line-soft:rgba(34,39,42,.09);
  --line-dark:rgba(255,255,255,.16);

  --font-display:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;
  --font-body:'Lora',Georgia,'Times New Roman',serif;

  --wrap:1240px;
  --wrap-narrow:760px;
  --gutter:clamp(1.25rem,5vw,3.5rem);
  --section-y:clamp(4.5rem,9vw,8rem);

  --header-h:calc(6rem + 1px);  /* min-height der Kopfzeile plus 1px Rahmen */
  --anchor-gap:2rem;            /* sichtbarer Abstand unter der Kopfzeile nach einem Sprung */

  --shadow-sm:0 1px 2px rgba(34,39,42,.05),0 6px 20px -12px rgba(34,39,42,.22);
  --shadow-md:0 2px 6px rgba(34,39,42,.06),0 22px 48px -26px rgba(34,39,42,.34);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;
     scroll-padding-top:calc(var(--header-h) + var(--anchor-gap))}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  background:var(--greige-100);
  color:var(--ink-800);
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  overflow-wrap:break-word;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit}
h1,h2,h3,h4,.h1,.h2,.h3{font-family:var(--font-display);font-weight:400;color:var(--ink-900);margin:0;
  line-height:1.14;letter-spacing:-.015em;overflow-wrap:break-word;hyphens:auto}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
ul,ol{margin:0;padding:0}

/* Sichtbarer, konsistenter Fokus (Tastaturbedienung) */
:focus-visible{outline:2px solid var(--ink-900);outline-offset:3px;border-radius:2px}
/* Sprungziele bekommen den Fokus, sollen aber keinen Rahmen um den halben Bildschirm zeichnen */
main:focus,.section[tabindex]:focus{outline:none}
.on-dark :focus-visible,.site-footer :focus-visible{outline-color:var(--greige-200)}

::selection{background:var(--ink-900);color:var(--greige-100)}

/* Nur fuer Screenreader */
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Layout-Helfer ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:var(--wrap-narrow)}
.section{padding-block:var(--section-y)}
/* Sprungziele: das Eigenpolster des Abschnitts aus dem Ankerversatz herausrechnen,
   damit der sichtbare Abstand unter der Kopfzeile auf jeder Breite gleich bleibt.
   Negative scroll-margin-Werte sind nach CSS Scroll Snap Level 1 zulaessig. */
.section[id]{scroll-margin-top:calc(0px - var(--section-y))}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ink-900);color:var(--greige-100);
  padding:.85rem 1.35rem;font-family:var(--font-display);font-size:.875rem;
  text-decoration:none;
}
.skip-link:focus{left:.75rem;top:.75rem}

/* ---------- Typografie-Bausteine ---------- */
.eyebrow{
  font-family:var(--font-display);font-weight:500;
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-600);margin:0 0 1.1rem;display:flex;align-items:center;gap:.85rem;
}
.eyebrow::after{content:"";flex:0 0 46px;height:1px;background:var(--line)}
.on-dark .eyebrow{color:var(--greige-300)}
.on-dark .eyebrow::after{background:var(--line-dark)}

h1,.h1{font-size:clamp(2.35rem,5.6vw,4.05rem);font-weight:300;letter-spacing:-.028em}
h2,.h2{font-size:clamp(1.75rem,3.4vw,2.6rem);font-weight:300;letter-spacing:-.022em}
h3,.h3{font-size:1.28rem;font-weight:500;letter-spacing:.005em;line-height:1.32}
.lead{font-size:clamp(1.09rem,1.55vw,1.22rem);line-height:1.72;color:var(--ink-700)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.75rem;
  font-family:var(--font-display);font-size:.78rem;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;text-decoration:none;
  padding:1.02rem 1.7rem;border:1px solid transparent;
  transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease),transform .3s var(--ease);
}
.btn .arw{transition:transform .3s var(--ease)}
.btn:hover .arw{transform:translateX(5px)}
.btn--primary{background:var(--ink-900);color:var(--greige-100);border-color:var(--ink-900)}
.btn--primary:hover{background:var(--ink-700);border-color:var(--ink-700)}
.btn--ghost{background:transparent;color:var(--ink-900);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--ink-900);background:rgba(34,39,42,.045)}
.btn--light{background:var(--greige-100);color:var(--ink-900);border-color:var(--greige-100)}
.btn--light:hover{background:#fff;border-color:#fff}

/* ---------- Kopfzeile ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:var(--greige-200);
  border-bottom:1px solid transparent;
  transition:background-color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);
}
.site-header.is-stuck{background:rgba(242,238,231,.94);backdrop-filter:blur(10px);border-bottom-color:var(--line-soft);box-shadow:0 1px 22px -14px rgba(34,39,42,.5)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:6rem}
/* Sehr flache Fenster (Querformat am Telefon, 400 % Zoom): Kopfzeile abflachen */
@media (max-height:520px){
  :root{--header-h:calc(4.25rem + 1px)}
  .header-inner{min-height:4.25rem}
  .brand img{height:40px}
}
.brand{display:flex;align-items:center;text-decoration:none;padding:.4rem 0}
.brand img{height:52px;width:auto}
@media (max-width:600px){.brand img{height:42px}}

.nav-list{list-style:none;display:flex;align-items:center;gap:clamp(1.1rem,2.4vw,2.3rem)}
.nav-list a{
  font-family:var(--font-display);font-size:.75rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  color:var(--ink-700);padding:.6rem 0;position:relative;display:inline-block;
  transition:color .25s var(--ease);
}
.nav-list a::after{
  content:"";position:absolute;left:0;right:0;bottom:.15rem;height:1px;
  background:var(--ink-900);transform:scaleX(0);transform-origin:left;
  transition:transform .32s var(--ease);
}
.nav-list a:hover{color:var(--ink-900)}
.nav-list a:hover::after,.nav-list a[aria-current]::after{transform:scaleX(1)}
.nav-list a[aria-current]{color:var(--ink-900)}

.nav-toggle{
  display:none;background:none;border:1px solid var(--line);
  width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer;
  color:var(--ink-900);
}
.nav-toggle span{display:block;width:20px;height:1.5px;background:currentColor;position:relative;transition:background-color .2s}
.nav-toggle span::before,.nav-toggle span::after{
  content:"";position:absolute;left:0;width:20px;height:1.5px;background:currentColor;
  transition:transform .3s var(--ease),top .3s var(--ease);
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

@media (max-width:900px){
  .nav-toggle{display:flex}
  .site-nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--greige-100);border-top:1px solid var(--line-soft);
    box-shadow:var(--shadow-md);
    max-height:0;overflow:hidden;visibility:hidden;
    transition:max-height .38s var(--ease),visibility .38s;
  }
  .site-nav.is-open{max-height:80vh;visibility:visible;overflow:auto}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;padding:.5rem var(--gutter) 1.5rem}
  .nav-list li+li{border-top:1px solid var(--line-soft)}
  .nav-list a{padding:1.05rem 0;font-size:.82rem}
  .nav-list a::after{display:none}
  .nav-list a[aria-current]{border-left:3px solid var(--ink-900);padding-left:.9rem}
}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--greige-200);overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;
  background:url('../img/pattern-tile.png') left -60px top -40px/210px 210px repeat;
  opacity:.16;pointer-events:none;
  -webkit-mask-image:linear-gradient(105deg,#000 0%,#000 26%,transparent 46%);
  mask-image:linear-gradient(105deg,#000 0%,#000 26%,transparent 46%);
}
.hero-inner{
  position:relative;display:grid;grid-template-columns:1fr minmax(0,46%);
  align-items:end;gap:clamp(2rem,5vw,4.5rem);
  min-height:clamp(480px,72vh,720px);
}
.hero-copy{padding-block:clamp(3.5rem,8vw,6.5rem) clamp(3.5rem,8vw,6.5rem);max-width:46ch}
.hero-copy h1,.hero-copy .h1{margin-bottom:1.6rem}
.hero-copy h1 span,.hero-copy .h1 span{display:block}
.hero-copy .lead{margin-bottom:2.4rem;max-width:38ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:.85rem}
.hero-actions .btn{min-width:15.5rem;justify-content:center}
@media (max-width:560px){.hero-actions{display:grid}.hero-actions .btn{min-width:0;width:100%}}
.hero-figure{position:relative;margin:0;align-self:end;justify-self:end;width:100%;max-width:520px}
.hero-figure img{width:100%;height:auto;display:block}
.hero-figure::after{
  content:"";position:absolute;left:-18px;bottom:-1px;width:1px;top:16%;
  background:linear-gradient(to bottom,transparent,var(--line));
}
@media (max-width:900px){
  .hero-inner{grid-template-columns:1fr;min-height:0;align-items:start}
  .hero-copy{padding-block:clamp(2.75rem,9vw,4rem) 0;max-width:none}
  .hero-figure{max-width:420px;justify-self:start;margin-top:2.75rem}
  .hero-figure::after{display:none}
  .hero::before{-webkit-mask-image:linear-gradient(160deg,#000 0%,transparent 38%);mask-image:linear-gradient(160deg,#000 0%,transparent 38%)}
}

/* ---------- Leistungen ---------- */
.services{background:var(--greige-50)}
.services-head{max-width:52ch;margin-bottom:clamp(2.75rem,5vw,4rem)}
.services-head h2{margin-bottom:1.1rem}
.service-grid{list-style:none;display:grid;gap:1px;background:var(--line-soft);border:1px solid var(--line-soft)}
@media (min-width:700px){.service-grid{grid-template-columns:1fr 1fr}}
.service{
  min-width:0;background:var(--greige-50);padding:clamp(1.9rem,3vw,2.5rem);
  display:flex;flex-direction:column;gap:1rem;
  transition:background-color .35s var(--ease),transform .35s var(--ease);
}
.service:hover{background:#fff}
.service .num{
  font-family:var(--font-display);font-size:.72rem;font-weight:500;letter-spacing:.2em;
  color:var(--ink-600);
}
.service .ico{width:34px;height:34px;color:var(--ink-900);margin-bottom:.15rem}
.service .ico svg{width:100%;height:100%;display:block}
.service h3{margin-bottom:.1rem}
.service p{font-size:.985rem;line-height:1.68;color:var(--ink-700);max-width:48ch}

/* ---------- Über mich ---------- */
.about{background:var(--greige-100);position:relative}
.about-grid{display:grid;gap:clamp(2.5rem,5vw,4.5rem);align-items:start}
@media (min-width:940px){.about-grid{grid-template-columns:minmax(0,1fr) minmax(0,.86fr)}}
@media (max-width:939px){.about-media{max-width:440px}}
.about-copy h2{margin-bottom:1.5rem}
.about-copy p{color:var(--ink-700)}
.about-media{position:relative}
.about-media .portrait{width:100%;box-shadow:var(--shadow-sm)}
.quote{
  margin:2.5rem 0 0;padding:1.75rem 0 0;border-top:1px solid var(--line);max-width:34ch;
  font-family:var(--font-display);font-weight:300;
  font-size:clamp(1.15rem,2.1vw,1.5rem);line-height:1.42;letter-spacing:-.015em;
  color:var(--ink-900);
}
.quote cite{display:block;margin-top:1rem;font-family:var(--font-body);font-style:normal;
  font-size:.85rem;letter-spacing:.02em;color:var(--ink-600)}

.facts{list-style:none;display:grid;gap:1px;background:var(--line-soft);
  border:1px solid var(--line-soft);grid-column:1/-1;margin-top:clamp(3rem,5vw,4.75rem)}
@media (min-width:600px){.facts{grid-template-columns:1fr 1fr}}
@media (min-width:940px){.facts{grid-template-columns:repeat(4,1fr)}}
.facts li{min-width:0;background:var(--greige-100);padding:1.4rem 1.6rem}
.facts .k{font-family:var(--font-display);font-size:.68rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-600);margin-bottom:.4rem;display:block}
.facts .v{font-size:1rem;color:var(--ink-900);line-height:1.5;display:block}

/* ---------- Ablauf ---------- */
.process{background:var(--greige-50)}
.process-head{max-width:52ch;margin-bottom:clamp(2.5rem,5vw,3.75rem)}
.process-head h2{margin-bottom:1.1rem}
.steps{list-style:none;counter-reset:step;display:grid;gap:0;padding:0}
@media (min-width:820px){.steps{grid-template-columns:1fr 1fr;gap:1px;background:var(--line-soft)}}
.step{
  min-width:0;counter-increment:step;background:var(--greige-50);
  padding:2rem 0;border-top:1px solid var(--line-soft);
}
@media (min-width:820px){
  .step{padding:2.25rem clamp(1.5rem,2.4vw,2.4rem) 2.5rem;border-top:none}
  .step:nth-child(odd){padding-left:0}
}
.step::before{
  content:counter(step,decimal-leading-zero);
  display:block;font-family:var(--font-display);font-weight:300;
  font-size:2.1rem;line-height:1;color:var(--greige-600);margin-bottom:1rem;
}
.step h3{margin-bottom:.55rem}
.step p{font-size:.985rem;color:var(--ink-700);line-height:1.68;max-width:46ch}

/* ---------- CTA-Band ---------- */
.cta{background:var(--ink-900);color:var(--greige-200);position:relative;overflow:hidden}
.cta::before{
  content:"";position:absolute;inset:0;
  background:url('../img/pattern-tile.png') right -70px center/230px 230px repeat;
  opacity:.07;filter:invert(1);pointer-events:none;
  -webkit-mask-image:linear-gradient(270deg,#000 0%,transparent 55%);
  mask-image:linear-gradient(270deg,#000 0%,transparent 55%);
}
.cta-inner{position:relative;display:grid;gap:2.25rem;align-items:center;padding-block:clamp(3.5rem,7vw,5.5rem)}
@media (min-width:880px){.cta-inner{grid-template-columns:1fr auto;gap:3.5rem;align-items:end}}
.cta h2{color:#fff;margin-bottom:.9rem}
.cta p{color:var(--greige-300);max-width:48ch;margin:0}

/* ---------- Kontakt ---------- */
.contact{background:var(--greige-100)}
.contact-grid{display:grid;gap:clamp(2.5rem,5vw,4rem);align-items:start}
@media (min-width:880px){.contact-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1fr)}}
.contact-intro h2{margin-bottom:1.2rem}
.contact-intro p{color:var(--ink-700)}
.contact-list{list-style:none;display:grid;gap:0}
.contact-list li{border-top:1px solid var(--line-soft)}
.contact-list li:last-child{border-bottom:1px solid var(--line-soft)}
.contact-list a,.contact-list .row{
  display:flex;align-items:flex-start;gap:1.25rem;
  padding:1.5rem .25rem;text-decoration:none;color:inherit;
  transition:background-color .3s var(--ease),padding-left .3s var(--ease);
}
.contact-list a:hover{background:rgba(34,39,42,.035);padding-left:1rem}
.contact-list .ci{flex:0 0 22px;width:22px;height:22px;margin-top:.3rem;color:var(--ink-700)}
.contact-list .ci svg{width:100%;height:100%;display:block}
.contact-list .k{display:block;font-family:var(--font-display);font-size:.68rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink-600);margin-bottom:.3rem}
.contact-list .v{display:block;font-size:1.075rem;color:var(--ink-900);line-height:1.5;word-break:break-word}

/* ---------- Fußzeile ---------- */
.site-footer{background:var(--ink-900);color:var(--greige-300);font-size:.925rem}
.footer-top{display:grid;gap:2.5rem;padding-block:clamp(3rem,6vw,4.5rem)}
@media (min-width:820px){.footer-top{grid-template-columns:1.3fr 1fr 1fr}}
.footer-top img.f-logo{height:56px;width:auto;filter:invert(1) contrast(1.08);opacity:.94}
.footer-top p{color:var(--greige-400);max-width:34ch;margin-top:1.5rem;font-size:.925rem;line-height:1.7}
.footer-col h3{font-family:var(--font-display);font-size:.68rem;font-weight:500;letter-spacing:.2em;
  text-transform:uppercase;color:#fff;margin-bottom:1.15rem}
.footer-col ul{list-style:none;display:grid;gap:0}
.footer-col li{display:flex;align-items:center;min-height:44px}
.footer-col li a{display:inline-flex;align-items:center;min-height:44px}
.footer-col a{color:var(--greige-300);text-decoration:none;transition:color .25s var(--ease)}
.footer-col a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.footer-bottom{
  border-top:1px solid var(--line-dark);padding-block:1.6rem;
  display:flex;flex-wrap:wrap;gap:.6rem 1.75rem;align-items:center;justify-content:space-between;
  font-size:.82rem;color:var(--greige-400);
}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:1.5rem}
.footer-bottom nav a{display:inline-flex;align-items:center;min-height:44px}

/* ---------- Rechtstext-Seiten ---------- */
.legal{background:var(--greige-50);padding-block:clamp(3rem,7vw,5.5rem) var(--section-y)}
.legal h1{font-size:clamp(1.6rem,6vw,2.9rem);margin-bottom:2.5rem}
.legal h2{font-size:clamp(1.25rem,2.1vw,1.55rem);margin:2.75rem 0 .9rem}
.legal h3{font-size:clamp(1.02rem,1.6vw,1.15rem);font-weight:500;margin:1.9rem 0 .6rem;color:var(--ink-900)}
.legal p,.legal li{color:var(--ink-700);font-size:1rem;overflow-wrap:break-word}
.legal ul{padding-left:1.15rem;margin:0 0 1.15em;list-style:disc}
.legal li{margin-bottom:.4rem}
.legal a{color:var(--ink-900);text-underline-offset:3px}
.legal .back{
  display:inline-flex;align-items:center;gap:.65rem;margin-bottom:2rem;min-height:44px;padding-block:.5rem;
  font-family:var(--font-display);font-size:.75rem;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;color:var(--ink-600);
}
.legal .back:hover{color:var(--ink-900)}
.legal .placeholder{
  background:var(--greige-200);border-left:3px solid var(--greige-500);
  padding:1rem 1.25rem;margin:1.25rem 0;font-size:.94rem;color:var(--ink-800);
}
.legal .placeholder strong{font-family:var(--font-display);font-weight:500}
.legal .mt-2{margin-top:2rem}
.legal .mt-3{margin-top:2.5rem}
.legal code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;
  background:rgba(34,39,42,.07);padding:.1em .4em}

/* ---------- Reveal-Animation ---------- */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.is-visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
}

/* ---------- Druck ---------- */
@media print{
  .site-header,.nav-toggle,.hero-actions,.hero::before,.cta::before{display:none!important}
  .reveal{opacity:1!important;transform:none!important}
  body{background:#fff;color:#000}
  .hero,.services,.about,.process,.contact,.legal{background:#fff}
  .cta,.cta h2,.cta p,.cta .eyebrow,.site-footer,.site-footer *{background:#fff!important;color:#000!important}
  .footer-top img.f-logo{filter:none!important}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.85em;word-break:break-all}
}


/* ---------- Blocksatz ---------- */
/* Fließtext im Blocksatz, mit automatischer Silbentrennung gegen Lücken. */
.services-head .lead,
.service p,
.about-copy p,
.process-head .lead,
.step p,
.cta-inner p:not(.eyebrow),
.contact-intro p:not(.eyebrow){
  text-align:justify;
  text-align-last:left;
  -webkit-hyphens:auto;
  hyphens:auto;
  -webkit-hyphenate-limit-before:3;
  -webkit-hyphenate-limit-after:3;
  hyphenate-limit-chars:7 3 3;
}
/* Auf schmalen Spalten wieder Flattersatz – dort reißt der Blocksatz Löcher. */
@media (max-width:700px){
  .services-head .lead,
  .service p,
  .about-copy p,
  .process-head .lead,
  .step p,
  .cta-inner p:not(.eyebrow),
  .contact-intro p:not(.eyebrow){text-align:left}
}