/* ═══════════════════════════════════════════════════════════
   Landingpages im CI der Homepage (2026-10-01, Pilot Kirchardt).
   Nur Ergänzungen — Grundlage sind styles.css und die Unterseiten-
   Vorlage des Designers (.cacao / .cacao-faq / .faq).
═══════════════════════════════════════════════════════════ */
:root{--ink-muted:var(--ink-soft);--radius-lg:2px}

/* Hero: unter der festen Navigation beginnen, heller Grund wie die Seite */
.lp-hero.cacao{padding-top:calc(var(--nav-h) + clamp(40px,6vw,80px));background:var(--bg)}
.lp-hero .cacao__img-frame{aspect-ratio:4/5;max-height:640px;border:1px solid var(--line-faint)}
.lp-hero .cacao__img{filter:saturate(.55) contrast(1.04)}
.lp-hero .section-tag{margin-top:6px}
.lp-crumbs{display:flex;gap:10px;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:18px}
.lp-crumbs a:hover{color:var(--sage)}
.lp-actions{display:flex;flex-wrap:wrap;gap:12px}

/* Textblöcke */
.lp-text{padding:clamp(48px,7vw,96px) 0}
.lp-text__wrap{max-width:var(--w);margin:0 auto;padding:0 var(--pad);display:grid;gap:clamp(48px,7vw,88px)}
.lp-text__block{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(24px,5vw,72px);align-items:start}
.lp-text__block .section-tag{grid-column:1/-1}
.lp-text__block .section-title{font-size:clamp(28px,3.6vw,46px);margin:0}
.lp-text__block p{font-size:15px;font-weight:300;line-height:1.9;color:var(--ink-soft);max-width:520px}
@media(max-width:860px){.lp-text__block{grid-template-columns:1fr}}

/* Arbeiten */
.lp-works{padding:clamp(40px,6vw,80px) 0 clamp(56px,7vw,96px);background:var(--panel-soft)}
.lp-works__wrap{max-width:var(--w);margin:0 auto;padding:0 var(--pad)}
.lp-works__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,24px);margin-top:clamp(28px,4vw,44px)}
.lp-works__item{margin:0;position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--panel-dim)}
.lp-works__item img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.45) contrast(1.05);transition:transform 1.6s var(--e-silk),filter 1.2s var(--e-std)}
.lp-works__item:hover img{transform:scale(1.04);filter:saturate(.7)}
.lp-works__item figcaption{position:absolute;left:16px;bottom:14px;font-size:8px;letter-spacing:.32em;text-transform:uppercase;color:rgba(255,255,255,.92);text-shadow:0 1px 8px rgba(10,16,13,.55)}
.lp-works__more{margin-top:22px;text-align:right;font-size:9px;letter-spacing:.24em;text-transform:uppercase}
.lp-works__more a{color:var(--ink-faint)}
.lp-works__more a:hover{color:var(--sage)}
@media(max-width:640px){.lp-works__grid{grid-template-columns:1fr 1fr}.lp-works__item:last-child{display:none}}

/* Anfrageformular — weißes Panel wie die Preistabelle */
.lp-form{padding:clamp(56px,8vw,104px) 0}
.lp-form__wrap{max-width:760px;margin:0 auto;padding:0 var(--pad)}
.lp-form__head{text-align:center;margin-bottom:clamp(28px,4vw,44px)}
.lp-form__lead{font-size:14px;font-weight:300;color:var(--ink-soft);line-height:1.8;margin-top:14px}
.lp-form__panel{background:var(--panel);border:1px solid var(--line-faint);box-shadow:0 1px 0 #fff inset,0 4px 24px rgba(10,16,13,.04);padding:clamp(22px,4vw,44px);display:grid;gap:18px}
.lp-form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:640px){.lp-form__row{grid-template-columns:1fr}}
.lp-form__field{display:grid;gap:7px}
.lp-form__field span,.lp-form__file-label{font-size:8.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink-faint)}
.lp-form__field input,.lp-form__field textarea{font:300 15px/1.6 var(--sans);color:var(--ink);background:var(--bg-warm);border:1px solid var(--line);padding:12px 14px;border-radius:0;outline:none;transition:border-color .3s}
.lp-form__field input:focus,.lp-form__field textarea:focus{border-color:var(--sage-soft);background:#fff}
.lp-form__file{display:grid;gap:7px}
.lp-form__file input{font:300 13px var(--sans);color:var(--ink-soft)}
.lp-form__file-hint{font-size:11px;color:var(--ink-faint)}
.lp-form__consent{display:flex;gap:10px;align-items:flex-start;font-size:12px;font-weight:300;line-height:1.6;color:var(--ink-soft)}
.lp-form__consent input{margin-top:3px;accent-color:var(--sage)}
.lp-form__consent a{text-decoration:underline;text-underline-offset:2px}
.lp-form__error{font-size:13px;color:#9b3b2e}
.lp-form__submit{justify-self:start}
.lp-form__done{text-align:center;padding:clamp(28px,4vw,44px);background:var(--panel);border:1px solid var(--line-faint)}


.lp-form__field select{font:300 15px/1.6 var(--sans);color:var(--ink);background:var(--bg-warm);border:1px solid var(--line);padding:12px 14px;border-radius:0}
.lp-form [hidden]{display:none!important}

/* Hinweis unter den Fragen (spirituelle Angebote / Coaching) */
.lp-note{margin-top:22px;font-size:12px;font-weight:300;line-height:1.7;color:var(--ink-faint);text-align:center}

/* Weiterlesen — gleiche Liste wie /ratgeber/ */
.lp-related{padding:clamp(40px,6vw,72px) 0}
.lp-related__wrap{max-width:var(--w);margin:0 auto;padding:0 var(--pad)}
.rg__list{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--line)}
.rg__link{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--line-faint);transition:padding .4s var(--e-silk)}
.rg__link:hover{padding-left:8px}
.rg__title{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(17px,1.8vw,20px);color:var(--ink);line-height:1.35}
.rg__link:hover .rg__title{color:var(--sage)}
.rg__tag{flex-shrink:0;font-size:8.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint)}

/* Illustrationen (Leistungs-Bilder) im Hero nicht beschneiden */
.lp-hero img[data-slot^="leistung-"]:not([data-gallery-done]){object-fit:contain;background:var(--panel);filter:none}
.lp-hero img[data-slot^="leistung-"]:not([data-gallery-done]) + .cacao__img-veil{display:none}
.lp-hero .cacao__img-frame:has(img[data-slot^="leistung-"]:not([data-gallery-done])){aspect-ratio:1/1;background:var(--panel)}
