/* Ergänzungen zum Vorschau-Design (annaschoppa.de). Nur Bausteine, die es in den
   Vorschauen nicht gab, plus Korrekturen an Vorschau-Fehlern (unten markiert). */

.skip-link{position:absolute;left:-9999px;top:8px;z-index:300;background:var(--deep);color:var(--cream);padding:10px 16px;border-radius:var(--r-sm)}
.skip-link:focus{left:12px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
img{max-width:100%;height:auto}

/* --- Kopfzeile + Mobilmenü (außerhalb des Headers wegen backdrop-filter) --- */
.nav-links a.active{color:var(--gold)}
.nav-links a.active::after{width:100%;left:0}
.burger{width:44px;height:44px;border-radius:50%;line-height:1}
@media (max-width:1060px){.nav-links{display:none}.burger{display:inline-grid;place-items:center}}
@media (max-width:420px){.nav-cta .btn{display:none}}
.mobile-nav{position:fixed;inset:0;z-index:120;background:var(--cream);padding:88px 28px 40px;overflow-y:auto;
  display:flex;flex-direction:column;gap:6px;transform:translateY(-100%);visibility:hidden;transition:transform .35s cubic-bezier(.16,1,.3,1),visibility 0s .35s}
.mobile-nav.open{transform:none;visibility:visible;transition:transform .35s cubic-bezier(.16,1,.3,1)}
.mobile-nav a{font-family:'Cinzel',serif;font-size:1.25rem;letter-spacing:.06em;color:var(--ink);padding:12px 0;border-bottom:1px solid var(--line)}
.mobile-nav a.sub{font-family:'Inter',sans-serif;letter-spacing:0;font-size:1rem;color:var(--ink-soft);padding:8px 0 8px 18px;border-bottom:0}
.mobile-nav .btn{margin-top:22px;justify-content:center;font-family:'Inter',sans-serif;letter-spacing:.04em;font-size:1rem;border:0}
.mobile-nav .mn-contact{margin-top:18px;font-size:.95rem;color:var(--ink-soft)}
.mobile-nav .mn-contact a{font-family:'Inter',sans-serif;font-size:.95rem;letter-spacing:0;border:0;padding:0}
.mobile-nav-close{position:absolute;top:18px;right:20px;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--white);font-size:1.6rem;cursor:pointer;color:var(--ink)}
body.menu-open{overflow:hidden}
body.menu-open .site-header{backdrop-filter:none;-webkit-backdrop-filter:none}

/* --- Brotkrumen --- */
.crumb-bar{background:var(--whisper);padding:14px 0;font-size:.82rem;color:var(--ink-soft);border-bottom:1px solid var(--line)}
.crumb-bar a{color:var(--primary);font-weight:500}
.crumb-bar .sep{margin:0 8px;color:var(--muted)}
.tpl-landing .crumb-bar{position:relative;z-index:2}

/* --- Buchungsbox (ersetzt den eingebetteten eTermin-Kalender der Vorschau) --- */
.book-card{max-width:940px;margin:0 auto;background:var(--white);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);border:1px solid var(--line);
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);overflow:hidden;position:relative;z-index:1}
.book-services{list-style:none;margin:0;padding:34px 38px}
.book-services li{display:flex;justify-content:space-between;gap:18px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.book-services li:last-child{border-bottom:0}
.book-services .svc{font-weight:600;color:var(--ink)}
.book-services .svc small{display:block;font-weight:400;color:var(--ink-soft);font-size:.86rem;margin-top:2px}
.book-services .price{font-family:'Cinzel',serif;font-size:1.15rem;color:var(--primary);white-space:nowrap}
.book-services .price.free{color:var(--gold)}
.book-action{background:linear-gradient(160deg,var(--whisper),var(--gold-soft));padding:34px 32px;display:flex;flex-direction:column;justify-content:center;gap:16px}
.book-action h3{margin:0;font-size:1.3rem}
.book-action p{margin:0;color:var(--ink-soft);font-size:.95rem}
.book-action .btn{justify-content:center}
.book-action .alt a{font-weight:600}
.book-note{text-align:center;font-size:.82rem;color:var(--muted);margin-top:18px;position:relative;z-index:1}
@media (max-width:780px){.book-card{grid-template-columns:minmax(0,1fr)}.book-services{padding:24px 22px}.book-action{padding:28px 22px}}

/* --- Rollen-Karten als Links --- */
a.role-card{color:inherit;text-decoration:none;display:block}
.role-card .role-link{display:inline-block;margin-top:.6em}

/* --- Unterseiten: Inhaltsblöcke --- */
.split{padding:110px 0}
.split.alt{background:var(--whisper)}
.split-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.split-grid.rev > :first-child{order:2}
.split-media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:4/5;border:1px solid var(--gold-soft)}
.split-media img{width:100%;height:100%;object-fit:cover;display:block}
.split h2{margin-bottom:.6em}
.split p{color:var(--ink-soft)}
.offer-list{list-style:none;padding:0;margin:1.2em 0 1.8em;display:flex;flex-wrap:wrap;gap:10px}
.offer-list li{border:1px solid var(--gold-soft);background:var(--white);border-radius:var(--r-pill);padding:8px 18px;font-family:'Cinzel',serif;font-size:.85rem;letter-spacing:.08em;color:var(--deep)}
.check-list{list-style:none;padding:0;margin:0 0 1.6em}
.check-list li{position:relative;padding:7px 0 7px 30px;color:var(--ink-soft)}
.check-list li::before{content:"✦";position:absolute;left:0;top:7px;color:var(--gold);font-size:.9rem}
@media (max-width:980px){.split{padding:80px 0}.split-grid{grid-template-columns:minmax(0,1fr);gap:40px}.split-grid.rev > :first-child{order:0}.split-media{max-width:460px}}

/* --- Fließtext (Rechtstexte) --- */
.prose-section{padding:72px 0 96px}
.prose{max-width:780px;margin:0 auto;font-size:1rem}
.prose h1{font-size:clamp(1.9rem,3.6vw,2.8rem)}
.prose h2{font-size:clamp(1.3rem,2.2vw,1.7rem);margin-top:1.6em}
.prose h3{font-size:1.15rem;margin-top:1.4em}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose .lead{font-size:1.12rem;color:var(--ink-soft)}
.legal-note{background:var(--gold-soft);border-radius:var(--r-md);padding:18px 22px;font-size:.95rem;margin-bottom:2em}

/* --- Kontakt --- */
.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}
.contact-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px}
.contact-card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 18px;font-size:.97rem}
.contact-card dt{font-family:'Cinzel',serif;color:var(--primary);letter-spacing:.06em}
.contact-card dd{margin:0}
.form{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;display:grid;gap:16px}
.form label{font-weight:600;font-size:.9rem;display:grid;gap:6px}
.form input,.form textarea{font:inherit;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--cream);color:var(--ink)}
.form input:focus,.form textarea:focus{border-color:var(--gold);outline:none;background:var(--white)}
.form .consent{font-weight:400;font-size:.86rem;display:flex;gap:10px;align-items:flex-start}
.form .consent input{margin-top:4px}
.form .hp{position:absolute;left:-9999px}
.form-status{font-weight:600;min-height:1.4em}
.form-status.ok{color:var(--primary)}
.form-status.err{color:#b3261e}
@media (max-width:980px){.contact-grid{grid-template-columns:minmax(0,1fr)}}

.disclaimer{font-size:.84rem;color:var(--muted);max-width:780px;margin:28px auto 0;text-align:center}
.faq-bottom-nudge{margin-top:40px;text-align:center;color:var(--ink-soft)}
.faq-bottom-nudge a{font-weight:600}

/* --- Querverweis zur Familien-Website --- */
.cross{padding:72px 0;background:var(--white);border-top:1px solid var(--line)}
.cross-card{display:flex;gap:28px;align-items:center;justify-content:space-between;flex-wrap:wrap;max-width:980px;margin:0 auto}
.cross-card p{margin:0;color:var(--ink-soft);max-width:620px}
.cross-card h2{font-size:clamp(1.3rem,2.2vw,1.8rem);margin-bottom:.3em}

/* --- Fußzeile --- */
.footer-legal{display:flex;gap:18px;flex-wrap:wrap}
.footer-legal a{color:rgba(250,246,238,.55)}
.footer-legal a:hover{color:var(--gold-warm)}

/* Korrektur Vorschau: Akzentwort als inline-block -> Satzzeichen rutschte in eigene Zeile */
.section-head h2 em.accent{display:inline;background:linear-gradient(var(--gold),var(--gold)) no-repeat 0 100%/0 2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:3px;transition:background-size 1s cubic-bezier(.16,1,.3,1)}
.section-head h2 em.accent::after{display:none}
.section-head.in h2 em.accent{background-size:70% 2px}
@media (prefers-reduced-motion:reduce){.section-head h2 em.accent{background-size:70% 2px}}

/* Mobil: 1fr-Spalten durch minmax(0,1fr) ersetzen (Überlauf langer Wörter) */
@media (max-width:680px){
  .hero-grid,.about-grid,.roles-grid,.intuit-grid,.footer-grid,.blocks-grid,.intro-grid,.transform-grid,.fw-grid,.testi-grid,.intuit-meta{grid-template-columns:minmax(0,1fr)!important}
  .hero-grid > *,.about-grid > *{min-width:0}
  h1,h2{overflow-wrap:break-word;hyphens:auto}
  .container{padding:0 20px}
}

/* Zierelemente der Vorschau ragten mobil 2–5 px über den Rand (gemessen) */
main{overflow-x:clip}
@media (max-width:680px){.about-deco{right:-8px;top:-16px}}

/* Autorenbox (E-E-A-T): wer schreibt, Qualifikation, Aktualität */
.author-box{padding:56px 0;border-top:1px solid var(--line)}
.ab-card{max-width:860px;margin:0 auto;display:flex;gap:26px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 30px}
.ab-card img{width:110px;height:110px;border-radius:50%;object-fit:cover;object-position:50% 22%;flex:0 0 auto}
.ab-card .eyebrow{margin-bottom:.6em}
.ab-name{font-size:1.25rem;margin:0 0 .3em}
.ab-card p{margin:0 0 .4em;font-size:.95rem;color:var(--ink-soft)}
.ab-meta{font-size:.85rem!important;color:var(--muted)!important}
.ab-meta a{font-weight:600}
@media (max-width:600px){.ab-card{flex-direction:column;text-align:center;padding:24px 20px}}
.ab-name{font-family:"Cinzel",serif;letter-spacing:.06em}

/* Barrierefreiheit (WCAG AA, gemessen mit axe-core): Gold #b48f47 erreicht als Schrift nur 2,8–3,0:1.
   Gold-Knöpfe bleiben gold, mit dunkler Schrift (5,3:1); goldene Schrift auf hellem Grund wird #80622b (≥4,5:1). */
:root{--gold-text:#80622b;--muted:#5e6b6b}
.btn-gold,.btn-gold:visited{color:var(--ink)}
.btn-gold:hover{color:var(--gold-warm)}
.eyebrow,.role-num,.block-card .meta,.block-num,.tl-period,.nav-links a.active,.nav-links a:hover,.role-link:hover,
.book-services .price.free,a:hover{color:var(--gold-text)}
.intuit-teaser .eyebrow,.hero .hero-inner .eyebrow,.site-footer .eyebrow{color:var(--gold-warm)}
.faq-body a,.consent a,main p a:not(.btn),.prose a,.ab-meta a{text-decoration:underline;text-underline-offset:3px}
.footer-bottom{color:rgba(250,246,238,.66)}
.split-media.wide{aspect-ratio:4/3}
