/* compat-light.css – helle Umsetzung der shared.css-Body-Klassen + Alt-Variablen.
   Wird NACH site.css geladen. Erlaubt, bestehende Seiten (page-hero/page-section/…)
   auf den hellen Look zu bringen, ohne den Inhalt/Text zu ändern. */

/* Alt-Variablennamen auf helle Werte mappen (für seiteneigene Inline-/Style-Regeln) */
:root{
    --dark:#f7f6f0; --dark-2:#edefe6; --dark-3:#efe9de;
    --cream:#26241f; --text-light:#403b34; --text-muted:#8c8275;
    --gold:#7f9070; --gold-light:#5e6c50; --gold-dark:#4a5640;
    --transition:.35s ease;
    --font-serif:'Cormorant Garamond', Georgia, serif;
    --font-sans:'Jost', system-ui, -apple-system, sans-serif;
}

body{ background:var(--paper); color:var(--ink); }

/* Reveal: auf diesen Seiten immer sichtbar (kein verstecktes Content-Risiko) */
.reveal{ opacity:1 !important; transform:none !important; }

/* ── Buttons (shared.css-Namen, hell) ── */
.btn-primary, .btn-gold{ display:inline-block; position:relative; overflow:hidden; padding:14px 32px; background:var(--accent); color:#fff !important; font-family:var(--sans); font-size:.74rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; border:1px solid var(--accent); border-radius:100px; cursor:pointer; box-shadow:0 8px 24px rgba(127,144,112,.3); transition:background .3s,color .3s,border-color .3s,transform .3s cubic-bezier(.34,1.4,.5,1),box-shadow .3s; }
.btn-primary:hover, .btn-gold:hover{ background:var(--accent-d); border-color:var(--accent-d); color:#fff !important; transform:translateY(-2px); }
.btn-primary::before, .btn-gold::before{ content:""; position:absolute; top:0; left:-130%; width:55%; height:100%; background:linear-gradient(120deg, transparent, rgba(255,255,255,.4), transparent); transform:skewX(-22deg); transition:left .6s cubic-bezier(.4,0,.2,1); pointer-events:none; }
.btn-primary:hover::before, .btn-gold:hover::before{ left:135%; }
.btn-primary:hover, .btn-gold:hover{ box-shadow:0 13px 30px rgba(127,144,112,.45); }
.btn-primary:active, .btn-gold:active{ transform:translateY(0); box-shadow:0 5px 16px rgba(127,144,112,.3); }
.btn-primary:focus-visible, .btn-gold:focus-visible, .btn-outline:focus-visible, .btn-gold-outline:focus-visible{ outline:2px solid var(--accent-d); outline-offset:3px; }
.btn-outline, .btn-gold-outline{ display:inline-block; padding:14px 32px; background:transparent; color:var(--ink); border:1px solid var(--ink); border-radius:100px; font-family:var(--sans); font-size:.74rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; cursor:pointer; transition:background .3s,color .3s; }
.btn-outline:hover, .btn-gold-outline:hover{ background:var(--ink); color:var(--paper); }

/* ── Section-Helfer ── */
.section-label{ display:block; font-family:var(--sans); font-size:.7rem; font-weight:500; letter-spacing:.28em; text-transform:uppercase; color:var(--accent-d); margin-bottom:14px; }
.section-title{ font-family:var(--serif); font-size:clamp(2rem,4vw,3.2rem); font-weight:400; line-height:1.18; color:var(--ink); margin-bottom:16px; }
.section-title em{ font-style:italic; color:var(--accent-d); }
.section-sub{ font-size:.98rem; font-weight:300; color:var(--muted); line-height:1.7; max-width:580px; }
.divider-a{ width:64px; height:1px; background:var(--accent); opacity:.6; margin:20px 0 22px; }
.divider-b{ display:flex; align-items:center; justify-content:center; color:var(--accent); opacity:.7; margin:6px 0 22px; width:260px; }
.divider-b svg{ color:var(--accent); }

/* ── Page Hero (Bild + dunkler Verlauf, weiße Schrift) ── */
.page-hero{ position:relative; min-height:56vh; display:flex; align-items:flex-end; padding-bottom:54px; overflow:hidden; }
.page-hero-bg{ position:absolute; inset:0; background-size:cover; background-position:center; }
.page-hero-overlay{ position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,18,15,.34) 0%, rgba(20,18,15,.12) 38%, rgba(20,18,15,.5) 100%); }
.page-hero-content{ position:relative; z-index:2; padding:0 60px; max-width:1180px; margin:0 auto; width:100%; color:#fff; }
.page-eyebrow{ display:block; font-family:var(--sans); font-size:.7rem; font-weight:500; letter-spacing:.28em; text-transform:uppercase; color:rgba(255,255,255,.9); margin-bottom:12px; }
.page-hero h1, .page-hero h2, .page-hero .page-hero-title{ font-family:var(--serif); font-size:clamp(2.2rem,5vw,4rem); font-weight:400; line-height:1.15; color:#fff; margin-bottom:14px; text-shadow:0 2px 30px rgba(0,0,0,.3); }
.page-hero h1 em, .page-hero h2 em, .page-hero .page-hero-title em{ font-style:italic; color:#fff; }
.page-hero-desc{ font-size:1rem; font-weight:300; color:rgba(255,255,255,.92); max-width:520px; line-height:1.7; margin-bottom:26px; }

/* ── Page Sections ── */
.page-section{ background:var(--paper); padding:80px 40px; }
.page-section.alt{ background:var(--paper2); }
.page-inner{ max-width:860px; margin:0 auto; }
.page-inner h2{ font-family:var(--serif); font-size:clamp(1.7rem,3vw,2.2rem); font-weight:400; color:var(--ink); margin:44px 0 14px; line-height:1.25; }
.page-inner h2:first-child{ margin-top:0; }
.page-inner h2 em, .page-inner h3 em{ font-style:italic; color:var(--accent-d); }
.page-inner h3{ font-family:var(--serif); font-size:1.4rem; font-weight:400; color:var(--ink); margin:30px 0 10px; }
.page-inner p{ font-size:1rem; font-weight:300; color:var(--ink2); line-height:1.85; margin-bottom:18px; }
.page-inner ul{ list-style:none; margin:6px 0 28px; }
.page-inner ul li{ display:flex; align-items:flex-start; gap:14px; font-size:.95rem; font-weight:300; color:var(--ink2); padding:9px 0; border-bottom:1px solid var(--line); line-height:1.6; }
.page-inner ul li::before{ content:''; width:6px; height:6px; background:var(--accent); border-radius:50%; flex-shrink:0; margin-top:8px; }
.page-inner strong{ color:var(--ink); font-weight:500; }
.page-inner a:not(.btn-gold):not(.btn-primary):not(.btn-outline){ color:var(--accent-d); border-bottom:1px solid var(--line); }

/* ── Formularelemente generisch hell ── */
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=date], input[type=search], select, textarea{
    background:#fff; border:1px solid var(--line); color:var(--ink); border-radius:3px;
}
input::placeholder, textarea::placeholder{ color:var(--muted); }
input:focus, select:focus, textarea:focus{ border-color:var(--accent); outline:none; }

/* ── Picdrop / Embeds ── */
.picdrop-embed{ background:var(--paper2); }
.picdrop-embed iframe{ display:block; width:100%; border:none; }

/* ── Boudoir-Teaser (hell) ── */
.boudoir-teaser{ background:var(--paper2); border:1px solid rgba(127,144,112,.4); border-radius:6px; }
.boudoir-teaser-label{ color:var(--accent-d); }
.boudoir-teaser h3{ color:var(--ink); }
.boudoir-teaser p{ color:var(--ink2); }

/* Kein-Hero-Seiten: Abstand unter fixem Header */
body.nohero{ padding-top:72px; }

/* Druck: neue Kopf-/Fußzeile ausblenden */
@media print{
    header.site, nav.mobile, footer.site, .lb{ display:none !important; }
    body.nohero{ padding-top:0; }
}

/* ════════ Korrekturen (Refine) ════════ */
:root{ --sage:#7f9070; --sage-light:#9caf87; --sage-dark:#5e6c50; }

/* divider-b: Ringe mittig mit flankierenden Linien */
.divider-b{ width:260px; max-width:80%; margin-left:auto; margin-right:auto; }
.divider-b::before, .divider-b::after{ content:''; flex:1; height:1px; opacity:.5; }
.divider-b::before{ background:linear-gradient(to right, transparent, var(--accent)); }
.divider-b::after{ background:linear-gradient(to left, transparent, var(--accent)); }
.divider-b svg{ flex-shrink:0; margin:0 10px; color:var(--accent); opacity:.75; }

/* Dunkle Custom-Heros (Bild + Overlay): Text wieder WEISS */
.dl-hero-content, .plan-hero-content, .wd-hero-content{ color:#fff; }
.dl-hero-content h1, .dl-hero-content h2, .dl-hero-content p, .dl-hero-content span, .dl-hero-content .page-eyebrow,
.plan-hero-content h1, .plan-hero-content h2, .plan-hero-content p, .plan-hero-content span, .plan-hero-content .page-eyebrow,
.wd-hero-content h1, .wd-hero-content h2, .wd-hero-content h3, .wd-hero-content p, .wd-hero-content span, .wd-hero-content .page-eyebrow{ color:#fff !important; }
.dl-hero-content em, .plan-hero-content em, .wd-hero-content em{ color:#e9d6ab !important; }

/* Dienstleister: Filter-Subnav hell & gut sichtbar */
.dl-toolbar{ background:rgba(255,255,255,.96) !important; border:1px solid var(--line) !important; box-shadow:0 8px 26px rgba(0,0,0,.08); }
.dl-toolbar-item{ color:var(--ink2) !important; }
.dl-toolbar-item i{ color:var(--accent-d) !important; }
.dl-toolbar-item:hover{ background:var(--paper2) !important; color:var(--ink) !important; }
.dl-toolbar-item.is-active{ background:var(--accent) !important; color:#fff !important; }
.dl-toolbar-item.is-active i{ color:#fff !important; }

/* Checkliste: Phasen-/Kategorie-Köpfe lesbar */
.ck-phase-head{ background:var(--paper2) !important; border:1px solid var(--line) !important; }
.ck-phase-title{ color:var(--ink) !important; }
.ck-phase-sub{ color:var(--muted) !important; }
.ck-phase-num{ background:#fff !important; color:var(--accent-d) !important; border:1px solid var(--accent) !important; }

@media (max-width:768px){
    .page-hero{ padding-bottom:44px; }
    .page-hero-content{ padding:0 24px; }
    .page-section{ padding:60px 24px; }
}