/* Karl Lorenz — Immobilien-Landingpage (Dildora Lorenz).
   Eigener Rahmen innerhalb der Website-Sprache: warmes Papier, Terrakotta, ivypresto.
   Alles unter .dl gekapselt, damit das strux-Theme nichts überschreibt. */

.dl{
  --paper:#F6F1E8;          /* warmes Papier, eine Nuance wärmer als der Rest der Seite */
  --paper-2:#EFE7DA;
  --white:#fff;
  --ink:#1E1915;
  --ink-2:#211B16;
  --muted:#8A8177;
  --line:#E2D9CB;
  --line-ink:rgba(246,241,232,.16);
  --accent:#D15B3E;
  --accent-2:#B0431F;
  --cream:#F3ECE1;
  --e-display:cubic-bezier(.16,1,.3,1);
  --e-body:cubic-bezier(.25,.46,.45,.94);
  --e-ui:cubic-bezier(.4,0,.2,1);
  --serif:ivypresto-display,"Playfair Display",Georgia,serif;
  --gut:clamp(16px,4vw,32px);
  position:relative;
  background:var(--white);
  color:var(--ink);
  font-family:'Open Sans',system-ui,sans-serif;
  overflow-x:clip;
}
.dl *,.dl *::before,.dl *::after{box-sizing:border-box}
.dl :where(p){margin:0}
.dl :where(h1,h2,h3,h4){margin:0}
.dl h1,.dl h2,.dl h3,.dl h4{font-weight:300;font-family:var(--serif);color:inherit;letter-spacing:-.015em}
.dl :where(ul){margin:0;padding:0}
.dl ul{list-style:none}
.dl :where(a){color:inherit}   /* :where(), damit eigene Klassen wie .dl-btn nicht verlieren */
.dl-wrap{width:100%;max-width:1200px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}

/* ---------- Auszeichnungen ---------- */
.dl-kicker{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2)}
.dl-kicker::before{content:"";width:34px;height:1px;background:currentColor;flex:none;opacity:.6}
.dl-eyebrow{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-2);margin-bottom:clamp(14px,1.6vw,19px)}
.dl-h2{font-size:clamp(30px,4.1vw,46px);line-height:1.04}
.dl-note{font-size:15.5px;line-height:1.7;color:var(--muted)}

/* ---------- Hero ---------- */
.dl-hero{position:relative;background:var(--paper);padding:clamp(44px,6.4vw,78px) 0 clamp(120px,13vw,168px)}
.dl-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(180deg,rgba(246,241,232,0) 0%,rgba(233,223,207,.55) 100%);pointer-events:none}
.dl-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr);gap:clamp(26px,3.8vw,56px);align-items:end}
.dl-hero-copy{padding-bottom:6px}
.dl-h1{font-size:clamp(38px,6.4vw,92px);line-height:.9;letter-spacing:-.028em;margin:22px 0 0}
/* Zeilenmaske: schneidet nur senkrecht, die Seiten bleiben offen (lange Wörter überleben) */
.dl-line{display:block;clip-path:inset(-.32em -100vw -.04em -100vw)}
.dl-line>span{display:block;will-change:transform}
.dl-h1 em{font-style:normal;color:var(--accent)}
.dl-lead{margin-top:clamp(26px,3.4vw,46px);font-size:clamp(17px,1.4vw,19.5px);line-height:1.62;color:#453D36;max-width:46ch}
.dl-sign{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.dl-sign b{font-family:var(--serif);font-weight:400;font-size:21px;letter-spacing:-.01em}
.dl-sign span{font-size:14.5px;color:#5E564E}

/* Porträt: Terrakotta-Platte dahinter, Bild im Multiply-Ton (kein Schleier) */
.dl-portrait{position:relative;justify-self:end;width:min(100%,450px);padding:0 30px 30px 0;isolation:isolate}
.dl-portrait::before{content:"";position:absolute;inset:44px 0 0 44px;background:var(--accent);z-index:0}
.dl-portrait-img{position:relative;z-index:1;display:block;width:100%;aspect-ratio:410/568;background:var(--paper-2);overflow:hidden;box-shadow:0 26px 54px -34px rgba(30,25,21,.5)}
.dl-portrait-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 12%;filter:contrast(1.03) saturate(1.02);will-change:transform}

/* ---------- Die Frage + vier Antworten ---------- */
.dl-ask{position:relative;z-index:3;margin-top:clamp(-140px,-11vw,-96px)}
.dl-ask-card{background:var(--white);border-radius:20px;box-shadow:0 30px 70px -40px rgba(30,25,21,.42),0 2px 0 rgba(30,25,21,.04);padding:clamp(24px,3.2vw,38px)}
.dl-ask-h{font-size:clamp(24px,2.6vw,31px);line-height:1.1;margin-bottom:clamp(20px,2.2vw,28px)}
.dl-ask-note{margin-top:16px;font-size:14px;color:var(--muted)}
.dl-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.dl-choice{position:relative;display:flex;flex-direction:column;gap:10px;min-height:118px;padding:16px 18px 18px;border:1px solid var(--line);border-radius:14px;background:var(--white);text-align:left;cursor:pointer;font-family:inherit;color:var(--ink);
  transition:border-color .3s var(--e-ui),background .3s var(--e-ui),color .3s var(--e-ui),transform .16s var(--e-ui),box-shadow .3s var(--e-ui)}
.dl-choice-n{font-size:11.5px;font-weight:700;letter-spacing:.16em;color:var(--muted);transition:color .3s var(--e-ui)}
.dl-choice-t{font-size:17px;font-weight:600;line-height:1.28;margin-top:auto}
.dl-choice::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .42s var(--e-display)}
.dl-choice:hover{border-color:#CFC2AE;transform:translateY(-2px)}
.dl-choice:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.dl-choice:active{transform:scale(.985)}
.dl-choice.is-on{background:var(--ink);border-color:var(--ink);color:var(--cream);box-shadow:0 18px 34px -22px rgba(30,25,21,.8)}
.dl-choice.is-on .dl-choice-n{color:var(--accent)}
.dl-choice.is-on::after{transform:scaleX(1)}

/* ---------- Ablauf ---------- */
.dl-flow{padding:clamp(56px,7vw,92px) 0 clamp(52px,6.4vw,84px);background:var(--white)}
.dl-flow-head{max-width:720px;margin-bottom:clamp(30px,4vw,46px)}
.dl-flow-head p{margin-top:clamp(16px,1.9vw,22px)}
.dl-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2.6vw,34px)}
.dl-step{position:relative;padding-top:22px;border-top:1px solid var(--line)}
.dl-step-n{font-family:var(--serif);font-size:44px;line-height:1;color:var(--line);transition:color .5s var(--e-body)}
.dl-step:nth-child(1) .dl-step-n{color:var(--accent)}
.dl-step h3{margin:14px 0 8px;font-family:'Open Sans',system-ui,sans-serif;font-weight:600;font-size:17.5px;line-height:1.3;letter-spacing:0}
.dl-step p{font-size:15.5px;line-height:1.65;color:#5E564E}
.dl-step-hi{display:block;margin-top:12px;padding-left:12px;border-left:2px solid var(--accent);
  font-size:15.5px;line-height:1.5;font-weight:600;color:var(--ink)}
.dl-flow-gain{margin-top:clamp(24px,3vw,36px);font-size:16.5px;line-height:1.62;color:var(--ink);max-width:72ch}
.dl-flow-end{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(18px,2.4vw,34px);
  margin-top:clamp(26px,3.2vw,42px);padding-top:clamp(20px,2.4vw,30px);border-top:1px solid var(--line)}
.dl-flow-close{font-family:var(--serif);font-weight:300;font-size:clamp(21px,2.3vw,31px);line-height:1.1;
  letter-spacing:-.015em;color:var(--ink);max-width:26ch}
.dl-flow-close span{display:block}
.dl-flow-close span + span{color:var(--accent)}
@media(max-width:640px){.dl-flow-end{flex-direction:column;align-items:flex-start}.dl-flow-end .dl-btn{width:100%}}
.dl-steps.is-swap .dl-step{opacity:0;transform:translateY(10px)}
.dl-step{transition:opacity .42s var(--e-body),transform .42s var(--e-body)}

/* ---------- Warum ich (Tinte) ---------- */
.dl-why{position:relative;background:var(--ink-2);color:var(--cream);border-radius:26px 26px 0 0;padding:clamp(56px,7.4vw,100px) 0 clamp(50px,6.4vw,84px);margin-top:10px}
.dl-why::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background-image:radial-gradient(60% 46% at 12% 0%,rgba(209,91,62,.13),transparent 70%),radial-gradient(44% 40% at 96% 100%,rgba(209,91,62,.07),transparent 72%)}
.dl-why>*{position:relative}
.dl-why-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start}
.dl-why h2{font-size:clamp(29px,4.2vw,50px);line-height:1.02}
.dl-why-body p+p{margin-top:16px}
.dl-why-body p{font-size:16.5px;line-height:1.72;color:rgba(243,236,225,.8)}
.dl-why-link{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-size:14.5px;font-weight:600;color:var(--cream);text-decoration:none;border-bottom:1px solid rgba(243,236,225,.34);padding-bottom:4px;transition:border-color .3s var(--e-ui),color .3s var(--e-ui)}
.dl-why-link:hover{color:#fff;border-color:var(--accent)}
.dl-why-link span{transition:transform .34s var(--e-display)}
.dl-why-link:hover span{transform:translateX(5px)}
.dl-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:clamp(38px,5vw,64px);border-top:1px solid var(--line-ink)}
.dl-proof li{padding:26px 34px 4px 0}
.dl-proof li+li{padding-left:clamp(20px,2.4vw,34px);border-left:1px solid var(--line-ink)}
.dl-proof li:last-child{padding-right:0}
.dl-proof b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,236,225,.58);margin-bottom:10px}
.dl-proof li.is-accent b{color:var(--accent)}
.dl-proof p{font-size:16px;line-height:1.55;color:var(--cream)}

/* ---------- Über mich ---------- */
.dl-me{background:var(--paper);padding:clamp(54px,7vw,92px) 0}
.dl-me-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:clamp(26px,4.4vw,70px);align-items:start}
.dl-me-text{position:relative;padding-left:clamp(18px,2.4vw,30px)}
/* Zweifarbige Linie statt der üblichen Akzentkante: Terrakotta nur auf den ersten Zentimetern */
.dl-me-text::before{content:"";position:absolute;left:0;top:.35em;bottom:.2em;width:1px;background:var(--line)}
.dl-me-text::after{content:"";position:absolute;left:0;top:.35em;width:1px;height:54px;background:var(--accent)}
.dl-me-text p{font-size:clamp(17px,1.5vw,20px);line-height:1.62;color:#4A423B}
.dl-me-text p+p{margin-top:16px}
/* Schwerpunkte und Sprachen: zwei dichte Zeilen in einem Block, kein neues Muster */
.dl-facts{display:grid;grid-template-columns:minmax(0,2.3fr) minmax(0,1fr);gap:clamp(16px,2.4vw,34px);margin-top:clamp(22px,2.6vw,30px);padding-top:18px;border-top:1px solid var(--line)}
@media(max-width:700px){.dl-facts{grid-template-columns:minmax(0,1fr);gap:18px}}
.dl-focus{margin:0;font-size:14.5px;line-height:1.75;color:#5E564E}
.dl-focus b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.dl-me-card{background:var(--white);border-radius:16px;padding:26px 26px 22px;box-shadow:0 20px 50px -34px rgba(30,25,21,.4)}
.dl-me-card>b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.dl-contactlist{display:flex;flex-direction:column}
.dl-contactlist a,.dl-contactlist .dl-ci{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:15.5px;transition:color .25s var(--e-ui)}
.dl-contactlist a:last-child,.dl-contactlist .dl-ci:last-child{border-bottom:0}
.dl-contactlist span{font-size:12.5px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;flex:none}
.dl-contactlist a:hover{color:var(--accent-2)}
.dl-contactlist a strong,.dl-contactlist .dl-ci strong{font-weight:600}

/* ---------- Objekte ---------- */
.dl-objects{background:var(--white);padding:clamp(54px,7vw,92px) 0}
.dl-sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:14px 24px;margin-bottom:clamp(26px,3.4vw,42px)}
.dl-more{font-size:14.5px;font-weight:600;text-decoration:none;color:var(--accent-2);border-bottom:1px solid rgba(176,67,31,.34);padding-bottom:3px;transition:border-color .3s var(--e-ui)}
.dl-more:hover{border-color:var(--accent-2)}
.dl-objects .kl-igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}

/* ---------- Einsatzgebiet ---------- */
.dl-area{background:var(--paper);padding:clamp(50px,6.4vw,82px) 0}
.dl-places{display:flex;flex-wrap:wrap;gap:9px;margin-top:clamp(22px,2.4vw,30px)}
.dl-places li{background:var(--white);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:14.5px;color:#4A423B}
.dl-places li.is-core{background:var(--white);border-color:var(--accent);color:var(--accent-2);font-weight:600}

/* ---------- Kundenstimmen ---------- */
.dl-voices{background:var(--white);padding:clamp(54px,7vw,92px) 0}
.dl-voicelist{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,40px);margin-top:clamp(24px,3.2vw,40px)}
.dl-voice{display:flex;flex-direction:column;align-items:flex-start;padding-top:24px;border-top:1px solid var(--line)}
/* Zitate laufen über fünf, sechs Zeilen — dafür ist die Display-Antiqua nicht gebaut.
   Sie bleibt den Überschriften vorbehalten, der Fließtext läuft in der Textschrift der Website.
   Größer als der übrige Fließtext, damit der Block trotzdem als Stimme liest, nicht als Absatz.
   Kein hängendes Anführungszeichen: in Open Sans ist das „ so zierlich, dass es außerhalb der
   Spalte schlicht verschwindet — es bleibt im Satzspiegel. */
.dl-voice blockquote{margin:0!important;padding:0!important;background:none!important;border:0!important;max-width:none;quotes:none;font-family:'Open Sans',system-ui,sans-serif!important;font-weight:400;font-size:clamp(17px,1.4vw,18.5px);line-height:1.6;letter-spacing:0;color:var(--ink)!important}
/* Das Theme färbt jedes blockquote mit !important in die Akzentfarbe und ist dabei spezifischer.
   Der Text liegt deshalb in einem span — ein ganzer Absatz in Akzentfarbe zerstört die Akzentdisziplin. */
.dl-voice blockquote span{color:var(--ink);font:inherit;letter-spacing:inherit}
.dl-voice blockquote::before,.dl-voice blockquote::after{content:none!important;display:none!important}
.dl-voice figcaption{width:100%;margin-top:auto;padding-top:22px;font-size:13.5px;color:var(--muted);text-align:left;display:flex;justify-content:flex-start;align-items:center;gap:14px}
/* Porträts liegen nur als 120×120 vor: 56 px sind bei DPR 2 die Grenze der Schärfe.
   Graustufen halten sie in derselben Familie wie das Porträt im Kopf der Seite. */
.dl-voice figcaption img{flex:none;width:56px;height:56px;border-radius:4px;object-fit:cover;background:var(--paper-2);filter:grayscale(1) contrast(1.04)}
.dl-voice figcaption b{display:block;font-size:15px;font-weight:600;color:var(--ink);margin-bottom:2px}

/* ---------- Kontakt ---------- */
.dl-contact{background:var(--paper);padding:clamp(54px,7vw,92px) 0 clamp(60px,7.6vw,100px)}
.dl-contact-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(26px,4vw,58px);align-items:start}
.dl-contact .kl-form-wrap{max-width:none;margin:0;padding:0}
.dl-contact .kl-form{box-shadow:0 26px 60px -40px rgba(30,25,21,.45)}
.dl-aside h2{font-size:clamp(26px,3vw,36px);line-height:1.06;margin-bottom:16px}
.dl-aside>p{font-size:16.5px;line-height:1.68;color:#4A423B;margin-bottom:24px}
.dl-addr{font-size:15.5px;line-height:1.7;color:#4A423B;margin-top:22px;padding-top:20px;border-top:1px solid var(--line)}
.dl-addr a{color:var(--accent-2);text-decoration:underline;text-underline-offset:3px}
.dl-addr b{display:block;font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}

/* ---------- Intro-Choreografie ---------- */
html.js .dl-rise{opacity:0;translate:0 18px;transition:opacity .74s var(--e-body),translate .74s var(--e-display)}
html.js .dl-rise.is-in{opacity:1;translate:0 0}
html.js .dl-line>span{translate:0 105%}
html.js .dl-hero-copy .dl-kicker,html.js .dl-lead,html.js .dl-sign{opacity:0;translate:0 14px}
html.js .dl-portrait{opacity:0;translate:0 26px;scale:.985}
html.js .dl-ask-card{opacity:0;translate:0 22px}
html.js .dl-choice{opacity:0;translate:0 12px}
.dl.is-ready .dl-line>span{translate:0 0;transition:translate .96s var(--e-display)}
.dl.is-ready .dl-line:nth-child(2)>span{transition-delay:.09s}
.dl.is-ready .dl-hero-copy .dl-kicker{opacity:1;translate:0 0;transition:opacity .6s var(--e-body),translate .6s var(--e-display)}
.dl.is-ready .dl-lead{opacity:1;translate:0 0;transition:opacity .7s .28s var(--e-body),translate .7s .28s var(--e-display)}
.dl.is-ready .dl-sign{opacity:1;translate:0 0;transition:opacity .7s .38s var(--e-body),translate .7s .38s var(--e-display)}
.dl.is-ready .dl-portrait{opacity:1;translate:0 0;scale:1;transition:opacity .9s .12s var(--e-body),translate 1.05s .12s var(--e-display),scale 1.2s .12s var(--e-display)}
.dl.is-ready .dl-ask-card{opacity:1;translate:0 0;transition:opacity .8s .4s var(--e-body),translate .9s .4s var(--e-display)}
.dl.is-ready .dl-choice{opacity:1;translate:0 0;transition:opacity .55s var(--e-body),translate .55s var(--e-display),border-color .3s var(--e-ui),background .3s var(--e-ui),color .3s var(--e-ui),transform .16s var(--e-ui),box-shadow .3s var(--e-ui)}
.dl.is-ready .dl-choice:nth-child(1){transition-delay:.5s,.5s,0s,0s,0s,0s,0s}
.dl.is-ready .dl-choice:nth-child(2){transition-delay:.56s,.56s,0s,0s,0s,0s,0s}
.dl.is-ready .dl-choice:nth-child(3){transition-delay:.62s,.62s,0s,0s,0s,0s,0s}
.dl.is-ready .dl-choice:nth-child(4){transition-delay:.68s,.68s,0s,0s,0s,0s,0s}

/* ---------- Adaptiv ---------- */
@media(max-width:1000px){
  .dl-hero-grid{grid-template-columns:minmax(0,1fr);align-items:start;gap:34px}
  .dl-portrait{justify-self:start;width:min(100%,360px)}
  .dl-choices{grid-template-columns:repeat(2,1fr)}
  .dl-steps{grid-template-columns:repeat(2,1fr);gap:26px}
  .dl-why-grid,.dl-me-grid,.dl-contact-grid{grid-template-columns:minmax(0,1fr)}
  .dl-proof{grid-template-columns:minmax(0,1fr);border-top:0}
  .dl-proof li{border-right:0;border-top:1px solid var(--line-ink);padding:22px 0 4px}
  .dl-voicelist{grid-template-columns:minmax(0,1fr)}
  .dl-objects .kl-igrid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .dl-hero{padding:26px 0 clamp(96px,26vw,130px)}
  .dl-hero-grid{gap:22px}
  .dl-h1{font-size:clamp(32px,10.4vw,50px);margin-top:16px}
  /* Auf dem Telefon führt das Porträt — gross genug, um ein Bild zu sein, und nicht eine Marke */
  .dl-portrait{order:-1;justify-self:stretch;width:min(100%,340px);padding:0 18px 18px 0}
  .dl-portrait::before{inset:24px 0 0 24px}
  .dl-portrait-img{aspect-ratio:4/5;box-shadow:0 18px 34px -22px rgba(30,25,21,.45)}
  .dl-portrait-img img{object-position:50% 14%}
  .dl-ask{margin-top:-78px}
  .dl-ask-card{border-radius:16px}
  .dl-choices{grid-template-columns:minmax(0,1fr)}
  .dl-choice{min-height:0;flex-direction:row;align-items:center;gap:14px;padding:15px 16px}
  .dl-choice-t{margin-top:0;font-size:16px}
  .dl-steps{grid-template-columns:minmax(0,1fr);gap:22px}
  .dl-objects .kl-igrid{grid-template-columns:minmax(0,1fr)}
  .dl-why{border-radius:18px 18px 0 0}
  /* Tippziele: freistehende Links auf Fingergröße bringen */
  .dl-why-link,.dl-more{padding-top:11px;padding-bottom:11px}
  .dl-contactlist a,.dl-contactlist .dl-ci{padding:15px 0}
}

/* ---------- Bewegung aus ---------- */
@media(prefers-reduced-motion:reduce){
  html.js .dl-line>span,html.js .dl-hero-copy .dl-kicker,html.js .dl-lead,html.js .dl-sign,
  html.js .dl-portrait,html.js .dl-ask-card,html.js .dl-choice,html.js .dl-rise{opacity:1!important;translate:none!important;scale:1!important;transform:none!important}
  .dl *,.dl *::before,.dl *::after{transition-duration:.001ms!important;animation-duration:.001ms!important}
}

/* ---------- Vertrauenszeile, Knöpfe, Hinweise (ТЗ 22.09.2026) ---------- */
.dl-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.dl-trust{margin-top:16px;font-size:13.5px;font-weight:600;letter-spacing:.01em;color:#5E564E}
.dl-trust i{font-style:normal;color:var(--accent);padding:0 4px}
.dl-hint{font-size:13px;line-height:1.5;color:var(--muted);margin-top:8px}
.kl-form .dl-hint{display:block;font-weight:400;letter-spacing:0;margin-top:6px}
.dl-limit{font-size:15.5px!important;line-height:1.65!important;color:rgba(243,236,225,.62)!important;padding-left:16px;border-left:1px solid var(--line-ink)}
.dl-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border:0;border-radius:8px;background:var(--accent);color:#fff;font:600 15.5px/1 'Open Sans',system-ui,sans-serif;text-decoration:none;cursor:pointer;
  box-shadow:0 12px 26px -14px rgba(217,99,63,.9);transition:background .25s var(--e-ui),transform .12s var(--e-ui)}
.dl a.dl-btn,.dl button.dl-btn{color:#fff}
.dl-btn:hover,.dl a.dl-btn:hover{background:var(--accent-2);color:#fff}
.dl a.dl-btn--ghost,.dl button.dl-btn--ghost{color:var(--ink)}
.dl a.dl-btn--ghost:hover,.dl button.dl-btn--ghost:hover{color:var(--cream)}
.dl-btn:active{transform:scale(.985)}
.dl-btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.dl-btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.dl-btn--ghost:hover{background:var(--ink);border-color:var(--ink);color:var(--cream)}
.dl-aside-cta{margin:22px 0 4px}

/* ---------- Angebote: diskrete Vermittlung ---------- */
.dl-discreet{margin-top:clamp(18px,2.4vw,28px);background:var(--paper);border-radius:16px;padding:clamp(24px,3.4vw,40px);
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px 36px;align-items:center}
.dl-discreet p{font-size:16.5px;line-height:1.65;color:#4A423B;max-width:62ch}
.dl-discreet p+p{margin-top:12px}

/* ---------- Kundenstimmen: neue Karten mit Sternen ---------- */
.dl-voices-cta{margin-top:clamp(26px,3.4vw,40px)}
.dl-stars{margin:0 0 12px;font-size:17px;line-height:1;letter-spacing:.12em;color:var(--accent)}
.dl-stars i{font-style:normal;color:var(--line)}
.dl-voice-src{margin-top:10px;font-size:12.5px;letter-spacing:.04em;color:var(--muted)}
.dl-voice--new blockquote{font-size:clamp(16px,1.3vw,17.5px)}

/* ---------- Häufige Fragen ---------- */
.dl-faq{background:var(--paper);padding:clamp(50px,6.4vw,82px) 0}
.dl-faq-list{margin-top:clamp(22px,3vw,36px);border-top:1px solid var(--line);max-width:860px}
.dl-faq-item{border-bottom:1px solid var(--line)}
.dl-faq-item summary{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:20px 0;cursor:pointer;list-style:none;
  font-family:var(--serif);font-weight:400;font-size:clamp(19px,1.7vw,23px);line-height:1.25;color:var(--ink)}
.dl-faq-item summary::-webkit-details-marker{display:none}
.dl-faq-item summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.dl-faq-item summary i{flex:none;position:relative;width:18px;height:18px;margin-top:6px}
.dl-faq-item summary i::before,.dl-faq-item summary i::after{content:"";position:absolute;left:0;top:8px;width:18px;height:1.5px;background:var(--accent);transition:transform .34s var(--e-display)}
.dl-faq-item summary i::after{transform:rotate(90deg)}
.dl-faq-item[open] summary i::after{transform:rotate(0)}
.dl-faq-item p{padding:0 38px 22px 0;font-size:16px;line-height:1.7;color:#5E564E;max-width:72ch}

/* ---------- Bewertungsdialog ---------- */
html.dl-locked,html.dl-locked body{overflow:hidden}
.dl-modal{position:fixed;inset:0;z-index:10000;display:flex;align-items:flex-start;justify-content:center;padding:clamp(12px,4vh,56px) 16px;overflow-y:auto}
.dl-modal[hidden]{display:none}
.dl-modal-back{position:fixed;inset:0;background:rgba(30,25,21,.55);backdrop-filter:blur(2px)}
.dl-modal-box{position:relative;width:min(100%,640px);background:var(--white);border-radius:18px;padding:clamp(24px,3.4vw,40px);
  box-shadow:0 40px 90px -40px rgba(30,25,21,.6);animation:dl-pop .32s var(--e-display) both}
@keyframes dl-pop{from{opacity:0;translate:0 14px;scale:.985}to{opacity:1;translate:0 0;scale:1}}
.dl-modal-box h2{font-size:clamp(24px,2.6vw,30px);line-height:1.12}
.dl-modal-x{position:absolute;right:12px;top:12px;width:40px;height:40px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:17px;line-height:1;cursor:pointer;transition:background .2s var(--e-ui),color .2s var(--e-ui)}
.dl-modal-x:hover{background:var(--paper-2);color:var(--ink)}
.dl-modal-box .kl-form{box-shadow:none;padding:0;background:none;margin-top:18px}
.dl-modal-box .kl-form-ok{display:none}
.dl-modal-box .kl-form-ok.is-on{display:block}

/* Sterne als Radiogruppe: von rechts nach links, damit ~ das Füllen übernimmt */
.dl-rate{border:0;padding:0;margin:18px 0 0;min-width:0}
.dl-rate legend{padding:0;font-size:13px;font-weight:600;color:#3A3532}
.dl-rate-stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;margin-top:8px}
/* Das Theme zeichnet Radios mit eigenen Kaestchen — die muessen hier restlos verschwinden */
.dl-rate-stars input[type=radio]{position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;appearance:none!important;-webkit-appearance:none!important}
.dl-rate-stars input[type=radio]::before,.dl-rate-stars input[type=radio]::after{content:none!important;display:none!important}
/* Das Theme malt das Kaestchen als Pseudo-Element am Label, nicht am Radio selbst */
.dl-rate-stars label::before,.dl-rate-stars label::after{content:none!important;display:none!important}
.dl-rate-stars label{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;cursor:pointer;font-size:28px;line-height:1;color:#CFC2AE;transition:color .18s var(--e-ui),transform .12s var(--e-ui)}
.dl-rate-stars label:hover,.dl-rate-stars label:hover ~ label,
.dl-rate-stars input:checked,.dl-rate-stars input:checked ~ label{color:var(--accent)}
.dl-rate-stars input:checked+label,.dl-rate-stars input:checked+label ~ label{color:var(--accent)}
.dl-rate-stars label:active{transform:scale(.9)}
.dl-rate-stars input:focus-visible+label{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}

/* Zustände der Formulare */
.kl-form.is-busy{opacity:.72;pointer-events:none}
.kl-form .kl-btn--form[disabled]{opacity:.7;cursor:progress}

@media(max-width:700px){
  .dl-discreet{grid-template-columns:minmax(0,1fr)}
  .dl-discreet .dl-btn{width:100%}
  .dl-modal{padding:0}
  .dl-modal-box{width:100%;min-height:100%;border-radius:0;padding:56px 18px 32px}
  .dl-faq-item p{padding-right:0}
}

/* Auf schmalen Geraeten muessen Felder unter ihre Standardbreite schrumpfen duerfen */
.dl .kl-form label,.dl .kl-form .select_container{min-width:0}
.dl .kl-form input,.dl .kl-form select,.dl .kl-form textarea{min-width:0;max-width:100%}
@media(max-width:360px){.dl .kl-form{padding:18px 14px}.dl-modal-box{padding:52px 14px 28px}}

/* ---------- Rhythmus und Auswahlfelder (22.09.2026) ---------- */
/* Unter einer Antiqua von 46 px braucht die Erläuterung echte Luft, sonst klebt alles aneinander */
.dl-area-note{margin-top:clamp(16px,1.9vw,22px);max-width:62ch}

/* Das Theme packt jedes select in .select_container, macht es durchsichtig und malt einen
   eigenen grauen Pfeil — dadurch fiel das Feld aus der Formularsprache heraus. */
.dl .kl-form .select_container::before,.dl .kl-form .select_container::after{content:none!important;display:none!important}
.dl .kl-form select{
  -webkit-appearance:none;appearance:none;
  background-color:#faf8f4!important;   /* dieselbe Flaeche wie die uebrigen Felder aus kl-forms.css */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%23D15B3E' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 18px center!important;background-size:12px 8px!important;
  padding-right:44px!important;color:var(--ink)!important;accent-color:var(--accent);cursor:pointer}
.dl .kl-form select:focus{background-color:var(--white)!important}
/* Die aufgeklappte Liste zeichnet das System; Farben lassen sich aber setzen — ohne das
   liefen die Zeilen in der Akzentfarbe des Themes. */
.dl .kl-form select option{color:var(--ink);background:var(--white);font-weight:400}
.dl .kl-form select option:checked,.dl .kl-form select option:hover{background:var(--paper-2);color:var(--ink)}